四、层叠样式表（CSS）
CSS是Cascading Style Sheet 的缩写。译作“层叠样式表单”。是用于（增强）控制网页样式并允许将样式信息与网页内容分离的一种标记性语言
层叠样式表分为嵌入式样式表、链接式样式表和内嵌式样式表3种。
（1） 所谓的嵌入式层叠样式表，是指存储在该网面上的<head>标记之间的<style>标记间的代码集。
示例如下：
<style type="text/css">
<!--
p {
font-family: "宋体";
font-size: 16px;
font-style: normal;
font-weight: lighter;
}
-->
</style>
（2） 链接式层叠样式表可以附加到多个网页上，所以最为有用，并且可以在整个网站中统一应用相同的样式。如果要更改某种样式，只需在链接式层叠样式表中做一次更改，网站中的网页即可随之更改。通常，链接式层叠样式表使用“.css”作为文件扩展名，例如“Mystyles.css”。然后使用HTML的link对象。
示例如下：
<link rel=stylesheet href=" / Mystyles.css " type="text/css">
（3） 内联式样式表是直接在某一标记后面添加样式代码，这种类型的样式表一般是在属性面板中设定的样式。
示例如下：
<p style="margin-left: 0.5in; margin-right:0.5in">内联式样式表<p>
创建层叠样式表
下面就来对文本定义层叠样式，并详细介绍一下定义层叠样式表的操作步骤。
（1） 新建一个空白文档，并在文档中输入一些文字，并且不对文字作任何格式化。
（2） 在属性面板中单击“打开CSS面板”按钮，则打开如图5.1所示的“CSS样式”面板。
图5.1 “CSS样式”面板
（3） 在“CSS样式”面板中单击“新建CSS规则”按钮，则打开“新建CSS样式”对话框，在“选择器类型”栏中选中“标签”单选按钮，然后在“定义在”栏中选择“仅对该文档”单选按钮，然后单击“标签”下拉列表，在打开的下拉列表中选择“P”选项，如图5.2。
图5.2 “新建CSS规则”对话框
（4）在这个对话框中选择“标签”选项可以重新定义特定的HTML标签的默认格式。只需选择“标签（重新定义特定标签的外观）”选项，然后在“标签”字段中输入一个HTML标签，或从弹出菜单中选择一个标签即可。
（5）还可以为具体某个标签组合或所有包含特定Id属性的标签定义格式，只需选择“高级（ID、上下文选择器等）”选项，然后在“标签”字段中输入一个HTML标签，或从弹出菜单中选择一个标签即可。打开式菜单中选择一个标签即可。打开式菜单中提供的选择器包括a:active、a:hover、a:link和a:visited。
在这里只讲解对已有标签重新定义样式的操作，对于最后一种方式，可以自己进行练习。
（6）单击“确定”按钮，则进入“P的CSS样式定义”对话框。
[1] [2] [3] [4] 下一页
网友评论：