曝光台 注意防骗
网曝天猫店富美金盛家居专营店坑蒙拐骗欺诈消费者
VERSE { color: WindowText; background-color: Window }
XML 实用大全
第 430 页
表13-2 与所有颜色有关的属性一起使用的其他系统颜色
系统颜色关键字 含义
ActiveBorder 活动窗口边框
ActiveCaption 活动窗口标题
Appworkspace 多文档界面的背景色
Background 桌面背景色
BottonFace 三维显示元素的外观颜色
XML 实用大全
第 431 页
13.5 框
当使用CSS 来格式化一文档及其内容时，需要用到框。框具有边界和大小，用于存放元素的内容。这些框堆叠在一起并可互
相覆盖，以便根据样式单的规则，以有序的方式对齐元素的内容。CSS2 给框添加了新的轮廓（outline）属性，使框能够定
位在页面、其他框或窗口上的绝对位置处。
13.5.1 轮廓属性
CSS2 能够将轮廓加入到对象中。轮廓很像边框，但轮廓是绘在框之上的。其宽度不加到框宽度上。此外，如果CSS 元素是
非矩形的（不大可能），在此元素周围的轮廓也将是非矩形的。由于轮廓不必一定是矩形的，所以不能分别设置左、右、顶
和底轮廓，只能一次改变整个轮廓。
13.5.1.1 轮廓样式属性
outline-style 属性设置整个框的轮廓样式，它起的作用如同CSS1 中的border-style 属性，并且具有同样的11 个值，其
含义也相同：
1．none：无线条
2．hidden：使线条不可见，但仍占据空间
3．dotted：点线
4．dashed：虚线
5．solid：实线
6．double：双实线
7．grooved：凹槽线，好像埋入页面
8．ridge：凸纹线，好像突出页面
9．inset：嵌入线，整个对象（不仅仅是轮廓线）像是推入到文档里面
10．outset：外置线，整个对象（不仅仅是轮廓线）像是推出文档
11．inherit：使用父类的值
下列三条规则设置TITLE、AUTHOR 和REFRAIN 元素的轮廓样式：
TITLE { outline-style: solid }
AUTHOR { outline-style: outset }
REFRAIN {outline-style: dashed }
XML 实用大全
第 432 页
13.5.1.2 轮廓宽度属性
outline-width 属性的作用像第12 章讨论的margin-width 和border-width 属性一样，可使用无符号的长度或下列三个关
键字之一来设置框的轮廓宽度：
1．thin：大约0.5 到0. 75 磅
2．medium：大约1 磅
3．thick：大约1.5 到2 磅
例如下面的这条规则给STANZA 加上一条粗轮廓线，给VERSE 加上一条细轮廓线。
STANZA { outline: thick }
VERSE { outline: thin }
13.5.1.3 轮廓颜色属性
outline-color 属性设置元素框的轮廓颜色。一般地说，这种设置既可以使用颜色名（如red），也可以使用RGB 颜色（如
#FF0000）。但是，还有关键字值invert，此值反转屏幕的像素颜色（黑色变成白色，反之亦然）。
TITLE { outline color: #FFCCCC;
outline-style: inset;
outline width: thick }
AUTHOR { outline color: #FF33CC }
VERSE { outline-color: invert }
13.5.1.4 轮廓简略属性
outline 属性是简略属性，它设置容器框的所有四个边的轮廓宽度、颜色和样式。例如：
STANZA { outline: thin dashed red }
VERSE { outline: inset }
13.5.2 定位属性
CSS2 对文档中每个对象的位置提供了多种控制方法。可以把特定的对象或对象的特定类型按层放置。每层与其他层无关，
可独立移动。position 属性确定对象如何排列，可使用下列四个关键字值之一：
1．static：缺省的布局
2．relative：对象偏移其静态位置
XML 实用大全
第 433 页
3．absolute：相对于包含对象的框，将对象放置在特定的位置
4．fixed：对象放在窗口或页面的特定位置
13.5.2.1 相对定位（relative positioning）
编排文档时，格式化标识符根据对象和文本的正常信息流（flow），选择项目的位置。实际上，这就是对象缺省的静态格式
化，大多数文档创作者都使用这种方法来编排文档。编排文档完成之后，对象相对于当前位置可能会发生偏移。这种对象位
置的调整就是所谓的相对定位。使用相对定位，改变对象的位置，对其后的对象没有任何影响。由于相对定位的框完全保持
其正常的信息流的大小和间隔，因此，框可以交叠。
将position 属性设置为relative，可生成一个相对定位的对象。其偏移量可由left、right、top 和bottom 属性来控制。
使用JavaScript 来改变这些属性，甚至可以在文档上移动对象和层。可以使影像或文本移动、出现或消失、或中途改变。
例如，下面的这条规则将TITLE 元素从正常的位置向上移动50 像素，向左移动65 像素。
TITLE { position: relative; top: 50px; left: 65px }
13.5.2.2 绝对定位（Absolute Positioning）
绝对定位元素参照包含它的块来放置。它可为它包含的框建立一个新的包含块。绝对定位元素的内容不会在其他框周围流动。
这样可能会使它们造成显示在文档中的其他框的内容模糊不清。绝对定位元素对其后同属的出现顺序无任何影响，所以跟在
绝对定位元素后面的元素所产生的效果，就如同绝对定位元素不在此处一样。
AUTHOR { position: absolute; top: 60px; left: 140px }
13.5.2.3 精确定位（Fixed Positioning）
具有固定位置的元素相对于其显示窗口或页面的坐标放置。如果正在查看由连续媒体组成的文档，那么当此文档滚动时，被
固定的框就不会移动。如果被固定的框处于分页媒体上，那它总是会出现在每页的末尾。这样就能够把页脚或页眉放在文档
上，或将签名放在一系列只有一页纸的信件的末尾。例如，下面的规则，以将REFRAIN 元素的左上角放在距显示窗口（或打
印的纸张）左上角往下300 像素、往右140 像素的地方。
REFRAIN { position: fixed; top: 300px; left: 140px }
13.5.2.4 使用z-index 属性来层叠元素
z-index 属性控制定位框的层叠顺序。要改变缺省的z-index 值，可将z-index 设置为整数（如2）。有较大z-index 值的
中国航空网 www.aero.cn
航空翻译 www.aviation.cn
本文链接地址：
XML实用大全(122)
