您现在的位置是：网站首页> 编程资料编程资料
兼容各种浏览器篡位的css样式写法分享_浏览器兼容教程_CSS_网页制作_
2021-08-29
2395人已围观
简介 兼容各种浏览器篡位的css样式写法分享，需要的朋友可以参考下。
/*针对谷歌浏览器内核支持的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
还有写css样式一定要记住顺序：
以下为引用的内容：
#1 { color: #333; } /* Moz */
* html #1 { color: #666; } /* IE6 */
*+html #1 { color: #999; } /* IE7 */
顺序很重要
@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
还有写css样式一定要记住顺序：
以下为引用的内容：
#1 { color: #333; } /* Moz */
* html #1 { color: #666; } /* IE6 */
*+html #1 { color: #999; } /* IE7 */
顺序很重要
相关内容
- css 表单上传文件的“浏览”按钮修改_CSS教程_CSS_网页制作_
- DIV设置浮动后无法撑开外部DIV的解决办法_Div+CSS教程_CSS_网页制作_
- 链接伪类（:hover）CSS背景图片有闪动BUG的解决方法_CSS教程_CSS_网页制作_
- 纯css实现的跟随网页浮动的层_CSS布局实例_CSS_网页制作_
- css hack 兼容IE5.0、IE5.5、IE6.0、IE7.0、FF1.5、FF2.0 浏览器兼容教程_浏览器兼容教程_CSS_网页制作_
- DIV半透明代码 兼容主流浏览器_CSS教程_CSS_网页制作_
- CSS first-letter实现首字下沉_CSS教程_CSS_网页制作_
- 网页变灰配合全国哀悼日的css代码 20100421_CSS教程_CSS_网页制作_
- 让页脚紧贴页面底部的CSS代码_CSS教程_CSS_网页制作_
- 区别div和span、relative和absolute、display和visibility_Div+CSS教程_CSS_网页制作_
