美文网首页
css中有些属性的前面会加上“*”“_”,分别表示什么意思?

css中有些属性的前面会加上“*”“_”,分别表示什么意思?

作者: 叫丽丽啊 | 来源:发表于2018-07-05 22:42 被阅读68次

    css里的,你可以理解为屏蔽火狐浏览器(FF)用的,ie系列内核的浏览器可以识别后面的样式设置,而FF在解析到*后就会报错,然后跳到下个css进行样式解析。所以,我们通常用这个方式来进行浏览器样式方面的兼容处理。也就是说,用他来设置IE和FF的不同样式。
    比如:

    #box-middle{
    position:static;
     *position:absolute; 
    display:table-cell; 
    display:block; *top:50%;
    vertical-align:middle;
     *vertical-align:auto;
    }
    

    这里面,先设置了定位方式position:static,然后又写了 * position:absolute。
    这时,IE浏览器会无视 * 的存在,将后面的position样式覆盖前面的样式,则他会解析position为absolute;而FF却因为无法解析 * 而跳过了这条设置,所以他会解析position为static。
    结果就会出现这样的情况:FF里的position为static,IE里的position为absolute。

    补充:
    color{
    background-color: #CC00FF; /所有浏览器都会显示为紫色/
    background-color: #FF0000\9; /IE6、IE7、IE8会显示红色/
    background-color: #0066FF; /IE6、IE7会变为蓝色/
    _background-color: #009933; /
    IE6会变为绿色*/
    }
    好多css hack,最重要的是简单实用能解决问题就行了
    总结:
    \9: IE6 IE7 IE8
    *: IE6 IE7
    _: IE6
    *+: IE7


    IE6,IE7,Firefox兼容的css hack
    第一种办法:
    body
    {
    background:red;
    *background:blue !important;
    *background: green;
    }

    第一排给Firefox以及其他浏览器看;
    第二排给IE7,IE7既能能识别号,也能识别important;
    第三排给IE6也能识别
    号;
    第二种办法,使用_来区分IE6:

    body
    {
    background:red;
    *background:blue;
    _background: green;
    }

    第一排给Firefox以及其他浏览器看;
    第二排给IE7,IE7既能能识别*号;
    第三排给IE6能识别下划线

    相关文章

      网友评论

          本文标题:css中有些属性的前面会加上“*”“_”,分别表示什么意思?

          本文链接:https://www.haomeiwen.com/subject/ttjmuftx.html