SharePoint 母版页制作实例教程

SharePoint 2021-09-25 09:25:07

1、首先打开SharePoint Designer 2010，找到母版页，复制一份V4.master，用来做我们剪裁用，不建议修改之前的母版页，错了的话，不容易找回来。同时新建一个页面布局，引用自定义这个母版页，用来看效果。引用后预览下未修改的母版页，如图1所示：

2、编辑我们复制出来的母版页，我们要做的就是要一个网站的Head将来放Flash，要网站的Foot放版权信息，还有中间的Main用来给页面布局。在这里，我暂时隐掉了左侧导航，头部的其它控件等，如果有需要，可以随时显示出来。那么，开始我们的母版页之旅吧。

3、我们经过查看，可以看到这个区域，是将来我们网站主体显示的区域，而向上查看可以发现上面是这个区域，通过id我们可以看出来是2010特色的ribbon的区域。今天我们不需要这一区域，暂时隐藏掉，但是开发过程中，可能需要，当然，我们随时可以显示出来。我们在里面加上样式隐藏。

4、继续往下看是，同样通过id我们可以看到这个是title行，这个title行主要包括两部分，包括上面的网站信息行，还有下面的导航，我们隐藏掉上面的网站信息，留下下面的导航区域。同样，用样式隐藏。然后，在上面加上一个用来放我们头部的Flash，样式建议写在corev4.css里面，方便我们查找。

5、接下来是左侧导航，在PlaceHolderMain左边找到这个区域，通过id我们知道这个是左侧导航，隐藏之。同时在PlaceHolderMain下面加上Foot区域，写上下面的版权信息吧。看看我们现在的样子吧，如图2。

6、很明显有一点是不对的，通过IE开发工具，我们可以看到PlaceHolderMain的左边，还有一个区域。倒要看看这个空白是什么，继续IE开发工具找之。功夫不负有心人，终于发现这个区域里面的s4-ca里面有个margin-left:155px;，去掉之！问题解决！下面为了展示我们的页面是不是正确的，我们把Head、Body、Foot三个区域写上字，上个背景色，看看效果，如图3.