• CSS hack


    最近总结了一下css hack技巧,并且也从网上浏览了的一些资料,同时也发现网上很多博文其实都是在相互转载一些相同的资料,并没有真正验证过,其中有几个说的并不准确甚至是错的地方,因此本人将这些都重新测试了一遍,总结得出如下表格:

    符号     |      浏览器

    IE6

    IE7

    IE8

    IE9

    FF

    *

    ×

    ×

    ×

    !important

    ×

    _

    ×

    ×

    ×

    ×

    \0

    ×

    ×

    ×

    \9

    ×

    *html

    ×

    ×

    ×

    ×

    +

    ×

    ×

    ×

    *+html

    ×

    ×

    ×

    ×

    :root

    ×

    ×

    ×

    :以上结果是本人亲测之后得出,测试环境为:虚拟机中的IE6,物理机中IE9浏览器以及其自带的IE7,8模式,FF版本为19.0.2。

    再附上各符号的具体写法如下:

     1 #bg{
     2     background: red;
     3     _background: red;
     4     *background: red;
     5     +background: red;
     6     background: red\0;
     7     background: red\9;
     8     background: red!important;
     9 }
    10 :root #bg{
    11     background: red;
    12 }
    13 *html #bg{
    14     background: red;
    15 }
    16 *+html #bg{
    17     background: red;
    18 }

    一些方法可能不是一个浏览器所独有的,可能会有两个或以上的浏览器认识,但只要将几种方法配合使用就能写出只有某一个浏览器才识别的css。

    :root div{background: red\9;      这句代码只有IE9才能识别

    不过应该尽可能减少对CSS Hack的使用。Hack有风险,使用需谨慎。

    条件注释

    只有IE可读的IE条件注释是:

    <!--[if IE (lt gt lte gte) (version)]> <![endif]-->

    IE条件注释:

    <!--[if !IE (version)]>--> non-IE HTML Code <!--<![endif]-->

    后续更新

    想了解更多可以到http://browserhacks.com/

  • 相关阅读:
    Jquery 图片走马灯效果原理
    jquery实现跑马灯效果(一)
    jQuery实现网页放大镜功能
    JavaScript仿淘宝实现放大镜效果的实例
    jquery实现放大镜简单方法
    jQuery实现放大镜效果
    小白jquery横向菜单弹出菜单制作
    转载 Log4j2在WEB项目中配置
    Struts2关于命名空间的例子
    转载关于struts命名空间的一则报警
  • 原文地址:https://www.cnblogs.com/598869621zzm/p/3012638.html
Copyright © 2020-2023  润新知