M、盒子內的頁面分割 範例 描述 此屬性設定分頁是否發生在一個指定元素內。 支持情況 N、 Outline 屬性 範例 描述 outline 是outline-style, outline-width, 和outline-color的縮寫。此屬性要優於border屬性，因為它不會影響文件流，因而u更有助於除錯佈局問題。 支持情況 O、 display屬性的替代值 範例 描述 display 屬性通常設定為block, inline, 或none。替代值包括： 支持情況 處理可折疊空白 範例 描述 white-space屬性的pre-line值設定將多個空白元素折疊為一個空白，同時允許明確的設定斷行。 white-space 屬性的pre-wrap 值不會將多個空白折成一個，不過也允許明確的設定斷行。 支持情況 4、其它各種技術 A、@import的媒體類型 範例 描述 就像上面的例子一樣，引入的樣式表文件的媒體類型聲明在文件地址的後面。在該例子中，媒體類型是”screen”。 支持情況 Bugs 儘管IE6 和IE7 支援@import，它們在媒體類型被指定的時候會無效，甚至會引起正@import規則無效。 B、 計數遞增 範例 描述 這個CSS 技巧可讓你自動增加出現在指定元素前面的編號，結合before偽元素一起使用。 支持情況 C、產生內容的引用字符 範例 描述 指定用於產生內容的引用呼號，用於q標籤。 支持情況 5.重要bug和不相容問題 下面是上文沒有提到的IE6和IE7的眾多bug。當然這個清單不包括在這三個瀏覽器中都不支援的條目。 IE6 Bugs A、不支援用樣式設定<abbr> 元素 B、不支援以連字號和底線開頭的class和ID名 C、<select> 元素總是出現在堆疊最上面，無視z-index值 D、如果錨點的偽類沒有使用正確的順序(:link, :visited, :hover)，:hover 偽類將無效 E、一個屬性的!important 宣告會被同一規則中同一屬性的沒有使用!important的第二個宣告所覆寫。 F、height 表現類似min-height G、width 表現類似min-width H、左右margin雙倍 I、圓點邊框(dotted)看起來像虛線邊框(dashed) J、text-decoration的line-through 值在文字上看起來比別的瀏覽器高一些 K、有序列表如果有一個固定結構(haslayout為true，不能設定li的高度/寬度/zoom等啟動haslayout的值)，序號就不會增加，而是保持為1 L、列表元素不支援list-style-type的所有可用的值 M、如果清單條目浮動，指定的list-style-image 將不會顯示 N、不完全支援@font-face O、某些選擇器會錯誤的符合註解和文件聲明 P、如果一個ID 選擇器結合一個類別選擇器不匹配，同樣的ID選擇器結合不同的類別選擇器也將被當作不匹配。 IE7 Bugs A、有序列表如果有一個固定結構(haslayout為true，不能設定li的高度/寬度/zoom等啟動haslayout的值)，序號就不會增加，而是保持為1 B、列表元素不支援list-style-type的所有可用的值 C、如果清單條目浮動，指定的list-style-image 將不會顯示 D、不完全支援@font-face E、某些選擇器會錯誤的符合註解和文件聲明 F、一些在這裡沒有提到的IE bug只會在特定環境發生，而且沒有指定到特定的CSS屬性或值。 #box {
page-break-inside: avoid;
} IE6 No
IE7 No
IE8 Yes #box {
outline: solid 1px red;
} IE6 No
IE7 No
IE8 Yes #box {
display: inline-block;
} inline-block
inline-table
list-item
run-in
table
table-caption
table-cell
table-column
table-column-group
table-footer-group
table-header-group
table-row
table-row-group IE6 No
IE7 No
IE8 Yes p {
white-space: pre-line;
}
div {
white-space: pre-wrap;
} IE6 No
IE7 No
IE8 Yes @import url("styles.css") screen; IE6 No
IE7 No
IE8 Yes h2 {
counter-increment: headers;
}
h2:before {
content: counter(headers) ". ";
} IE6 No
IE7 No
IE8 Yes q {
quotes: "'" "'";
}
q:before {
content: open-quote;
}
q:after {
content: close-quote;
} IE6 No
IE7 No
IE8 Yes