• 技术文章 >Web开发 >css教程

    css中hack的3种表现形式

    小妮浅浅小妮浅浅2021-09-27 09:44:48原创3745

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

    微软官方推荐hack模式。

    只在IE下生效。

    <!--[if IE]>
    这段文字只在IE浏览器显示
    <![endif]-->
     
    只在IE6下生效
    <!--[if IE 6]>
    这段文字只在IE6浏览器显示
    <![endif]-->
     
    只在IE6以上版本生效
    <!--[if gte IE 6]>
    这段文字只在IE6以上(包括)版本IE浏览器显示
    <![endif]-->
     
    只在IE8上不生效
    <!--[if ! IE 8]>
    这段文字在非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教程

    本文教程操作环境:windows7系统、css3版,DELL G3电脑。

    专题推荐:css hack
    品易云
    上一篇:css中hack的原理 下一篇:css中link和@import的区别

    相关文章推荐

    • css定位的介绍• css元素有哪些类型• css选择器有哪些• css安装LESS的方法• css默认样式的整理• css浏览器的渲染过程• css怪异盒模型的介绍• css中padding如何计算• css中固定定位fixed是什么• css定位叠放次序是什么• css定位叠放次序的使用注意• css中hack是什么• css中hack的原理

    全部评论我要评论

    © 2021 Python学习网 苏ICP备2021003149号-1

  • 取消发布评论
  • 

    Python学习网