曝光臺 注意防騙
網(wǎng)曝天貓店富美金盛家居專營店坑蒙拐騙欺詐消費者
VERSE { color: WindowText; background-color: Window }
XML 實用大全
第 430 頁
表13-2 與所有顏色有關(guān)的屬性一起使用的其他系統(tǒng)顏色
系統(tǒng)顏色關(guān)鍵字 含義
ActiveBorder 活動窗口邊框
ActiveCaption 活動窗口標題
Appworkspace 多文檔界面的背景色
Background 桌面背景色
BottonFace 三維顯示元素的外觀顏色
XML 實用大全
第 431 頁
13.5 框
當(dāng)使用CSS 來格式化一文檔及其內(nèi)容時，需要用到框。框具有邊界和大小，用于存放元素的內(nèi)容。這些框堆疊在一起并可互
相覆蓋，以便根據(jù)樣式單的規(guī)則，以有序的方式對齊元素的內(nèi)容。CSS2 給框添加了新的輪廓（outline）屬性，使框能夠定
位在頁面、其他框或窗口上的絕對位置處。
13.5.1 輪廓屬性
CSS2 能夠?qū)⑤喞尤氲綄ο笾小］喞芟襁吙�，但輪廓是繪在框之上的。其寬度不加到框?qū)挾壬�。此外，如果CSS 元素是
非矩形的（不大可能），在此元素周圍的輪廓也將是非矩形的。由于輪廓不必一定是矩形的，所以不能分別設(shè)置左、右、頂
和底輪廓，只能一次改變整個輪廓。
13.5.1.1 輪廓樣式屬性
outline-style 屬性設(shè)置整個框的輪廓樣式，它起的作用如同CSS1 中的border-style 屬性，并且具有同樣的11 個值，其
含義也相同：
1．none：無線條
2．hidden：使線條不可見，但仍占據(jù)空間
3．dotted：點線
4．dashed：虛線
5．solid：實線
6．double：雙實線
7．grooved：凹槽線，好像埋入頁面
8．ridge：凸紋線，好像突出頁面
9．inset：嵌入線，整個對象（不僅僅是輪廓線）像是推入到文檔里面
10．outset：外置線，整個對象（不僅僅是輪廓線）像是推出文檔
11．inherit：使用父類的值
下列三條規(guī)則設(shè)置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 屬性一樣，可使用無符號的長度或下列三個關(guān)
鍵字之一來設(shè)置框的輪廓寬度：
1．thin：大約0.5 到0. 75 磅
2．medium：大約1 磅
3．thick：大約1.5 到2 磅
例如下面的這條規(guī)則給STANZA 加上一條粗輪廓線，給VERSE 加上一條細輪廓線。
STANZA { outline: thick }
VERSE { outline: thin }
13.5.1.3 輪廓顏色屬性
outline-color 屬性設(shè)置元素框的輪廓顏色。一般地說，這種設(shè)置既可以使用顏色名（如red），也可以使用RGB 顏色（如
#FF0000）。但是，還有關(guān)鍵字值invert，此值反轉(zhuǎn)屏幕的像素顏色（黑色變成白色，反之亦然）。
TITLE { outline color: #FFCCCC;
outline-style: inset;
outline width: thick }
AUTHOR { outline color: #FF33CC }
VERSE { outline-color: invert }
13.5.1.4 輪廓簡略屬性
outline 屬性是簡略屬性，它設(shè)置容器框的所有四個邊的輪廓寬度、顏色和樣式。例如：
STANZA { outline: thin dashed red }
VERSE { outline: inset }
13.5.2 定位屬性
CSS2 對文檔中每個對象的位置提供了多種控制方法�？梢园烟囟ǖ膶ο蠡�?qū)ο蟮奶囟愋桶磳臃胖�。每層與其他層無關(guān)，
可獨立移動。position 屬性確定對象如何排列，可使用下列四個關(guān)鍵字值之一：
1．static：缺省的布局
2．relative：對象偏移其靜態(tài)位置
XML 實用大全
第 433 頁
3．a(chǎn)bsolute：相對于包含對象的框，將對象放置在特定的位置
4．fixed：對象放在窗口或頁面的特定位置
13.5.2.1 相對定位（relative positioning）
編排文檔時，格式化標識符根據(jù)對象和文本的正常信息流（flow），選擇項目的位置。實際上，這就是對象缺省的靜態(tài)格式
化，大多數(shù)文檔創(chuàng)作者都使用這種方法來編排文檔。編排文檔完成之后，對象相對于當(dāng)前位置可能會發(fā)生偏移。這種對象位
置的調(diào)整就是所謂的相對定位。使用相對定位，改變對象的位置，對其后的對象沒有任何影響。由于相對定位的框完全保持
其正常的信息流的大小和間隔，因此，框可以交疊。
將position 屬性設(shè)置為relative，可生成一個相對定位的對象。其偏移量可由left、right、top 和bottom 屬性來控制。
使用JavaScript 來改變這些屬性，甚至可以在文檔上移動對象和層�？梢允褂跋窕蛭谋疽苿�、出現(xiàn)或消失、或中途改變。
例如，下面的這條規(guī)則將TITLE 元素從正常的位置向上移動50 像素，向左移動65 像素。
TITLE { position: relative; top: 50px; left: 65px }
13.5.2.2 絕對定位（Absolute Positioning）
絕對定位元素參照包含它的塊來放置。它可為它包含的框建立一個新的包含塊。絕對定位元素的內(nèi)容不會在其他框周圍流動。
這樣可能會使它們造成顯示在文檔中的其他框的內(nèi)容模糊不清。絕對定位元素對其后同屬的出現(xiàn)順序無任何影響，所以跟在
絕對定位元素后面的元素所產(chǎn)生的效果，就如同絕對定位元素不在此處一樣。
AUTHOR { position: absolute; top: 60px; left: 140px }
13.5.2.3 精確定位（Fixed Positioning）
具有固定位置的元素相對于其顯示窗口或頁面的坐標放置。如果正在查看由連續(xù)媒體組成的文檔，那么當(dāng)此文檔滾動時，被
固定的框就不會移動。如果被固定的框處于分頁媒體上，那它總是會出現(xiàn)在每頁的末尾。這樣就能夠把頁腳或頁眉放在文檔
上，或?qū)⒑灻旁谝幌盗兄挥幸豁摷埖男偶哪┪�。例如，下面的�?guī)則，以將REFRAIN 元素的左上角放在距顯示窗口（或打
印的紙張）左上角往下300 像素、往右140 像素的地方。
REFRAIN { position: fixed; top: 300px; left: 140px }
13.5.2.4 使用z-index 屬性來層疊元素
z-index 屬性控制定位框的層疊順序。要改變?nèi)笔〉膠-index 值，可將z-index 設(shè)置為整數(shù)（如2）。有較大z-index 值的
中國航空網(wǎng) www.k6050.com
航空翻譯 www.aviation.cn
本文鏈接地址：
XML實用大全(122)
