css中hack的3种表现形式

1、条件注释法。是IE浏览器专有的Hack模式。

微软官方推荐hack模式。

只在IE下生效。

<!--[ifIE]>
这段文字只在IE浏览器显示
<![endif]-->

只在IE6下生效
<!--[ifIE6]>
这段文字只在IE6浏览器显示
<![endif]-->

只在IE6以上版本生效
<!--[ifgteIE6]>
这段文字只在IE6以上(包括)版本IE浏览器显示
<![endif]-->

只在IE8上不生效
<!--[if!IE8]>
这段文字在非IE8浏览器显示
<![endif]-->

非IE浏览器生效
<!--[if!IE]>
这段文字只在非IE浏览器显示
<![endif]-->

2、类内属性前缀法,属性前缀法是在CSS风格属性名称之前添加一些hack前缀。

只有特定浏览器才能识别,以达到预期的页面显示效果。

/*CSS属性级Hack*/
color:red;/*所有浏览器可识别*/
_color:red;/*仅IE6识别*/
*color:red;/*IE6、IE7识别*/
+color:red;/*IE6、IE7识别*/
*+color:red;/*IE6、IE7识别*/
[color:red;/*IE6、IE7识别*/
color:red9;/*IE6、IE7、IE8、IE9识别*/
color:red;/*IE8、IE9识别*/
color:red!important;/*IE6不识别!important*/

3、选择器前缀法,针对某些页面表现不一致或需要特殊处理的浏览器。

在CSS选择器之前,添加一些只有特定浏览器才能识别的前缀。

/*CSS选择符级Hack*/
*html#demo{color:red;}/*仅IE6识别*/
*+html#demo{color:red;}/*仅IE7识别*/
:root#demo{color:red9;}:/*仅IE9识别*/
body:nth-of-type(1)#demo{color:red;}/*IE9+、FF3.5+、Chrome、Safari、Opera可以识别*/
head:first-child+body#demo{color:red;}/*IE7+、FF、Chrome、Safari、Opera可以识别*/

以上就是css中hack的3种表现形式,希望对大家有所帮助。更多css学习指路:css教程

原文来自:https://www.py.cn
© 版权声明
THE END
喜欢就支持一下吧
点赞8 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容