Article Detail

针对各种浏览器css不兼容的写法

/*针对谷歌浏览器内核支持的CSS样式*/ @media screen and (-webkit-min-device-pixel-ratio:0) { 样式 ...

HTML 阅读 31.4万 6 分钟阅读 2015-10-14 15:02
CSS
63 行
/*针对谷歌浏览器内核支持的CSS样式*/
@media screen and (-webkit-min-device-pixel-ratio:0) {

样式

}

/*针对IE6特制识别的CSS样式*/
*HTML .SearchBox
{

样式

}

针对Firefox浏览器的内核CSS写法:
@-moz-document url-prefix() {
.font1 {color:red}
}

IE8就是自己来调试了。调试一个浏览器,有不合适的地方可以在该内核css中重写对应的方法,只需把不合适的样式重写即可实现。*HTML中则例外,需要每重写一个都要加*HTML单独处理。
针对样式名

如果只让ie6看见用*html .head{color:#000;}
如果只让ie7看见用*+html .head{color:#000;}
如果只让ff看见用:root body .head{color:#000;}
如果只让ff、IE8看见用html>/**/body .head{color:#000;}
如果只是不让ie6看见用html>body .head{color:#000;} 即对IE 6无效
如果只是不让ff、IE8看见用*body .head{color:#000;}    即对ff、IE8无效

针对具体属性

如果只让ie6看见用_     .head{_color:#000;}
如果只让ie7看见用+与_结合的方法:     .head{+color:#f00;!;_color:#000;}

IE8正式版hack

\9″ 例:”margin:0px auto\9;”.这里的”\9″可以区别所有IE8和FireFox.
“*” IE6、IE7可以识别.IE8、FireFox不能.
“_” IE6可以识别”_”,IE7、IE8、FireFox不能.
如:
.a {color:#f00;     color:#f60\9;    +color:#00FF00;    _color:#0000FF; }
从左到右分别对应 FF,IE8 IE7 IE6
=============================
P{+color:#f00;}                支持 IE7 IE6        不支持 FF  IE8b
P{_color:#f00;}                支持ie6            不支持 FF
P{color:#f00; !important;}    
P{color:#f00;}                支持 IE6 IE7 IE8b FF
P{color:#00f !important;color:#f00; }     支持IE7 IE8b FF     不支持IE6
head:first-child+body p{color:#f00;}    支持IE7 IE8b FF       不支持IE6

/*\*//*/
/**/                    支持IE8b            不支持IE6 IE7 FF
html*{color:#f00}            支持IE6 IE7          不支持 IE8b FF
body>p{color:#f00}            支持IE7 IE8b FF        不支持 IE6
html[xmlns] p {color:#f00}        支持 IE7 IE8b FF    不支持 IE6
@import "style.css"
@import "style.css" 
@import url(style.css)
@import url('style.css')
@import url("style.css")        支持 IE6 IE7 IE8b FF

P{/*/*color:#f00;/* */}            支持 IE6 IE7  FF     不支持 IE8b
Comments 评论区
广西南宁市 2017-08-16 10:23

一个IE兼容性提供了多少就业岗位

广西南宁市2017-08-16 10:24:03

IE死的快些对开发人员有好处。

| | #0
Comment Form 留下评论
正在回复 #0
粘贴图片、拖拽文件,或点上面的按钮上传 图片会自动插入 [img] 标签,其他附件会自动插入 [attach] 标签。
正在上传...
提交前会先拉起旧项目同款第三方人机验证。

不再要求填写昵称;reply 会生成一条带楼层回链的新评论,quote 会附带完整引用块,并保持评论锚点跳转。

lizhenqiu blog is powered by lizhenqiu.com Version 6.9

Processed in 0.0080 second(s) W3C

本博客的所有原创作品采用 知识共享 署名-非商业性使用-相同方式共享 2.5 协议 进行许可

本站由 七七牛 云存储 阿阿里云 计算与安全服务 拍又拍云 CDN 加速 百百度智能 AAMH 布布集网 AI指南针AI

桂公网安备 45010302000998号 桂ICP备15007619号-1 中国互联网举报中心 建议使用谷歌浏览器浏览
Navigation 文章导航
⌂ ↓ ↑
100%
图片预览
Gallery 图集
0 张图片

正在整理正文和评论里的图片。

当前页还没有可展示的图片。
Quick Comment 快速评论

直接输入内容,提交时仍会走当前页面的人机验证。

正在上传...
操作提示