Web学习第八章.doc

第八章 更多的层叠样式表 8.1 链接 当创建一个能够改变链接颜色的规则时，下述伪类将不同样式关联到处于不同状态的链接。 link伪类：用于一般状态的链接的样式 visited伪类：用于已经访问的链接的样式 active：用于当前激活（单击）的链接的样式 hover：当鼠标指针悬停在链接上的链接样式 使用这些伪类时，需要下面特性： color：改变链接颜色 text-decoration：用于控制链接是否具有下划线 background－color：高亮显示链接 8.2 背景 background-color：指定页面或框的背景颜色； background-image：将一幅图像设置为任何框的背景。 body {background-image : url(image/backcolor.gif);} 重写background-color特性。 默认情况下，图像重复多次，以布满整个页面。 background-color特性设置为与背景图像相同的颜色。 background-repeat：四个可选的特性值； repeat：图像多次重复以覆盖整个页面 repeat-x：水平方向多次重复 repeat-y：垂直方向多次重复 no-repeat：不重复，仅显示一次 background-position：修改图像的位置 x% y%：沿水平和垂直方向的百分比 xy：水平垂直方向的绝对长度 left／center／right／top／bottom background-attachement：用于指定称为水印的图像。 即使用户向上或向下滚动页面或滚动页面中的其他元素，背景图像始终停留在相同的位 置。 fixed：图像不会移动 scroll：图像停留在页面背景上的相同位置处。若滚动页面，图像随之移动。 6. backgorund特性：简写。一次性指定5个背景特性。可以是任意顺序。 8.3 列表 ulli创建无序列表 olli创建有序列表 list-style-type：控制无序列表中项目符号的形状或有序列表中编号字符的样式。 无序列表 none：没有标记符 disc（默认值）：填充的圆 circle：空心圆 square：填充的正方形 有序列表 decimal：数值。1、2、3 decimal-leading-zero：在前面加0的数值。01、02、03 lower-alpha：小写字母。a、b、c upper-alpha：大写字母。A、B、C lower-roman：小写罗马数字 upper-roman：大写罗马数字。 list-style-position：指示标记符应该出现在包含项目列表的框的内部还是外部。 当项目列表中某项的文本超过一行时才有区别。 inside：文本超出一行，换行的文本将位于标记符的下方。 outside：换行文本与第一行文本的起始位置对齐。（有缩进） list-style-image：可用于指定一副图像，使用自己的项目符号样式。 li {list-style-image : url(image/li.gif);} 若图像无法显示，则使用默认值，一个圆点。 list-style：简写形式。一次性指定三种特性。 marker-offset：指定标记符和该标记符相关的文本之间的距离。 8.4 表 padding：设置表单元格边框和内容之间的空间量 border：边框特性 text／font：内容外观 text-align：水平对齐方式 vertical－align：垂直对齐方式 width／height／background-color／background-image Tips：避免将这些特性用于tr元素。 表的特性： border-collapse：指定浏览器是应当显示每一个边框还是基于指定规则显示。 collapse：水平边框将折叠，垂直边框互相邻接。 separate：遵守独立规则。 boder-spacing：指定相邻单元格边框之间的距离。 提供一个值：应用于水平和垂直距离； 提供两个值：第一个水平间隔，第二个垂直间隔； caption-side：指定caption元素内容相对于表的位置。 top／right／bottom／left empty-cells：指示当单元格没有内容时是否显示边框。 show／hidden／inherit table-layout：帮助控制浏览器如何显示或者布局一张表。 fixed／auto／inherit 8.5 外边框：不占用空间；不必是矩形 outline-width：指定外边框宽度。长度值或thin、medium、thick outline-style：指定外边框样式。solid、dotted、dashed outline-color：指定外边框颜色。 outline