特别致谢  本教程由课件吧(http://www.cai8.net)开发，并由本书作者寒蓝老师提供在“闪客起航”开设专栏进行在线学习，以帮助大家快速掌握CSS的知识。本教程选自清华大学出版社2008年2月出版的《Dreamweaver网页制作实用教程》一书。《Dreamweaver网页制作实用教程》是“21世纪师范院校计算机实用技术规划教材”中的一本教材。由于教材内容新颖、实用，深受广大读者的欢迎，目前全国已有多所中、高等院校和IT培训学校选择本书作为正式的网页制作教材。 朋友们可以在全国各新华书店购买此书，或者在当当网、互动出版网邮购此书。
第四课 CSS基本应用(一)前面学习了创建CSS样式的基本方法以及CSS样式的类型，本节将分门别类地对CSS样式提供的各类属性进行讨论，并通过一些实例讲解CSS在网页制作中的基本应用。 4.1.1 课堂实例――用CSS格式化文本1．创建内部CSS规则 （1）打开示例文件C:\ part6\4.1.1.html，切换到设计视图，示例文件中包含一些文本，如图4-1所示。下面将通过CSS样式对文本格式进行控制。
图4-1 示例文件中包含的文本 （2）选择命令【窗口】|【CSS样式】命令，打开【CSS样式】面板（快捷键Shift+ F11 ）。单击【CSS样式】面板右下角的【新建CSS规则】按钮
图4-2 【新建CSS规则】对话框 （3）在弹出的【.textCSS的规则定义】对话框中直接单击【确定】按钮，在左侧的【分类】列表中选择【类型】，然后到右侧窗格中进行设置，这里的设置和字体相关。这里对这些参数进行一些任意设置，设置完成后单击【确定】按钮，如图4-3所示。
图4-3 【.textCSS的规则定义】对话框 （4）再来看一下CSS样式在代码视图中的情况。单击【文档】工具栏中的【代码】按钮
图4-4 代码视图中看到的CSS规则 2．应用CSS规则 （1）进入设计视图，选择一部分文本，如图4-5所示。
图4-5 选择需要使用CSS样式的文本 （2）进入【属性】面板，展开【样式】后面的下拉列表，选择“textCSS”，如图4-6所示。
图4-6 为文字指定样式 （3）按下键盘上的快捷键F12打开浏览器进行预览可以看到CSS作用于文本的效果，如图4-7所示。
图4-7 CSS样式在浏览器中的显示效果
|
