CSS在Internet Explorer 6, 7 和8中的差别(4)-脚本在线

AI智能体脚本智能办公脚本自动化游戏脚本浏览器自动化脚本服务器脚本

CSS在Internet Explorer 6, 7 和8中的差别(4)

作者：互联网

2010-03-12

WEB标准化

M、盒子内的页面分割

示例

#box {
page-break-inside: avoid;
}

描述

该属性设定分页是否发生在一个指定元素内。

支持情况

IE6 No

IE7 No

IE8 Yes

N、 Outline 属性

示例

#box {
outline: solid 1px red;
}

描述

outline 是outline-style, outline-width, 和outline-color的缩写。该属性要优于border属性，因为它不会影响文档流，因而u更有助于调试布局问题。

支持情况

IE6 No

IE7 No

IE8 Yes

O、 display属性的替代值

示例

#box {
display: inline-block;
}

描述

display 属性通常设置为block, inline, 或none。替代值包括：

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;
}

描述

white-space属性的pre-line值设定将多个空白元素折叠为一个空白，同时允许明确的设置断行。white-space 属性的pre-wrap 值不会将多个空白折叠为一个，不过也允许明确的设置断行。

支持情况

IE6 No

IE7 No

IE8 Yes

4、其它各种技术

A、@import的媒体类型

示例

@import url("styles.css") screen;

描述

就像上面的例子那样，引入的样式表文件的媒体类型声明在文件地址的后面。在该例子中，媒体类型是”screen”。

支持情况

IE6 No

IE7 No

IE8 Yes

Bugs

尽管IE6 和IE7 支持 @import，它们在媒体类型被指定的时候会无效，甚至会引起正@import规则无效。

B、计数递增

示例

h2 {
counter-increment: headers;
}
h2:before {
content: counter(headers) ". ";
}

描述

该CSS 技术允许你自动增加出现在指定元素前面的编号，结合before伪元素一起使用。

支持情况

IE6 No

IE7 No

IE8 Yes

C、生成内容的引用字符

示例

q {
quotes: "'" "'";
}

q:before {
content: open-quote;
}

q:after {
content: close-quote;
}

描述

指定用于生成内容的引用呼号，用于q标签。

支持情况

IE6 No

IE7 No

IE8 Yes

5、重要bug和不兼容性问题

下面是在上文中没有提到的IE6和IE7的众多bug。当然这个列表不包括在这三个浏览器中都不支持的条目。

IE6 Bugs

A、不支持用样式设置元素

B、不支持以连字符和下划线开头的class和ID名

C、