一步步学习SPD2010--第十章节--SP网站品牌化（10）--使用智能提示来增加CSS

一步步学习SPD2010--第十章节--SP网站品牌化（10）--使用智能提示来增加CSS

        像许多MS的Web编辑程序和开发环境一样，SPD提供智能提示，帮助你快速写代码。当你在代码视图输入时，建议可能的标签、声明名称、属性和值的列表会出现。从列表中选择条目减少了你需要输入代码的数量，并且，列表也可以作为引用源和学习帮助。

        本练习中，你使用智能提示添加CSS规则到母版页的代码视图。CSS规则将改变标题。

        准备：使用SPD打开团队网站。

1. 导航窗格点击网站资产，导入文件。

2. 点击添加文件，选择bg.jpg。（Chapter10练习文件夹中有）。

3. 点击打开。确定。

4. 导航窗格点击母版页。右击v4.master复制。粘贴。获得v4_copy(1).master文件。

5. 重命名SPDSBSprototype.master。

6. 编辑文件。

7. 进入拆分视图。在代码视图中找到</head>标签，一般在第35行。光标放在前面，并Enter创建新行。

8. 输入<st，按下Tab选择style。

9. 空格。输入ty，按下Tab选择type=""。按下箭头，Tab选择text/css。然后输入>。按下Enter两次，插入两个新行。

10. 在style标签内部，输入.s4-t，按下Tab选择.s4-title。

11. 输入{b，选择background-color。输入#336699.按下Enter进入新行。

12. 继续这样输入。最后代码是这样的：

        注意：如果你的站点不是网站集的根站点.URL要用相对地址。比如你的团队站点是 http://wideworldimporters/sites/human resources。CSS属性应该是：

background-image: url(‘/sites/human resources/SiteAssets/bg.jpg’);

13. 点击设计视图。查看效果。

14. 右击SPDSBSprototype.master选项卡，保存。

        网站定义警告框打开。

        注意：因为原始母版页是网站定义页面，当你复制时，也创建了模板页。自定义母版页不是最佳实践。但是因为这个母版页是为原型目的创建的，自定义这个副本是开发解决方案的一个快速方法。

15. 点击是。

        你可以改变站点的logo，在网站设置--标题、描述和图标页面更改即可。