如何仅使用 CSS 来设置 Internet Explorer（所有版本）的样式？-css教程-PHP中文网

如何仅使用 CSS 来设置 Internet Explorer（所有版本）的样式？

Mary-Kate Olsen

发布： 2024-12-23 19:07:22

原创

760 人浏览过

How Can I Style Only Internet Explorer (All Versions) Using CSS Alone?

通过 CSS 仅对 Internet Explorer（所有版本）进行样式设置

问题：

在继承的项目中，有一个需要使用 CSS 专门针对 Internet Explorer 进行样式设置，无需修改 HTML

解决方案：

Internet Explorer 9 及更低版本：

利用条件注释加载外部样式表专为IE。

<!--\[if IE]--\>
<link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<!\[endif]--\>

登录后复制

Internet Explorer 10 和 11：

使用“-ms-high-contrast”创建媒体查询以应用IE 10 独有的 CSS 样式:

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
}

登录后复制

Microsoft Edge 12:

利用“@supports”规则来定位 IE Edge 12 及更高版本:

@supports (-ms-accelerator:true) {
    /* IE Edge 12+ CSS styles go here */ 
}

登录后复制

内联规则IE8 及以下版本：

/* For IE css hack */
margin-top: 10px /* apply to all ie from 8 and below */
*margin-top:10px;  /* apply to ie 7 and below */
_margin-top:10px; /* apply to ie 6 and below */

登录后复制

注意： 对于内联样式表，请考虑对 IE9 以下版本使用媒体查询和条件注释。

以上是如何仅使用 CSS 来设置 Internet Explorer（所有版本）的样式？的详细内容。更多信息请关注PHP中文网其他相关文章！