zoukankan      html  css  js  c++  java
  • 【转】用IE条件注释与CSS区分不同版本IE浏览器

    相信一些前端开发者或多或少都知道一些CSS Hacks代码,用这种代码来写CSS的目的主要是为了兼容各种浏览器,特别是IE的不同版本,另外区分IE浏览器的方法就是IE条件注释。本文主要介绍利用IE条件注释与CSS Hacks代码来区分IE6到IE9等不同版本浏览器,都是很实用方法。

    今天我们再次提起这些东西,我想说的是我们在使用这些CSS Hacks的时候是否考虑到它们的安全性,毕竟它们是使用特殊风格的指令来区别一些浏览器 的,它们是暂时的解决方案,并代表未来也是这样的。假如,

    随着火狐4的发布,他们也承认带有*前缀的属性。那个时候你头疼的事就来了。

    虽然我们一般情况下是不提倡使用的,我认为如果我能找到一个真正的CSS解决方案来处理现有问题的话,我们就谨慎的使用它。如果没有办法我就毫不迟疑地使用它们。

    但是,如果把 IE条件注释 和 CSS Hacks 组合使用,也许能为我们减少不必要的麻烦。

    <!--[if lte IE 7]>
       让IE7的快乐。
    <![endif]-->

    认识「\9」、「*」、「_」区别字符

    IE系列的浏览器可读「\9」,而IE6和IE7可读「*」(星号),另外IE6可辨识「_」(下划线),因此可以依照顺序写下来,就会让浏 览器正确的读取到自己看得懂得CSS语法,所以就可以有效区分IE各版本和非IE浏览器(像是Firefox、Opera、Google Chrome、Safari等)。

    IE8 及 以下的

    对于IE8 及以下的的浏览器,用一个hack,那就是在你的样式属性末尾处添加 “ \9 ” 。

    例如:

    body {
     color: red; /*支持所有的浏览器*/
     color : green\9; /* 支持IE8 及 以下的 */
    }

    IE7 及 以下的

    当然要使用 “ * ” ,它只有IE6和IE7可以认出来,IE8和其它的浏览器不做处理。

    body {  
     color: red; /*支持所有的浏览器*/
     color : green\9; /* 支持IE8 及 以下的 */
     *color : yellow; /* 支持IE7 及 以下的  */  
    }

    最后,我们强调一个hack,在IE6没有离开我们之前,大多数设计师所熟的是“ _ ” 下划线 ,而不是“ * ” 符号。它只针对Internet Explorer 6 。

    body {
     color: red; /* all browsers, of course */
     color : green\9; /* IE8 and below */
     *color : yellow; /* IE7 and below */
     _color : orange; /* IE6 */
    }

    原文地址:http://www.websbook.com/htmlcssdiv/yIEtjzsyCSSqfbtbbIEllq_18940.html

  • 相关阅读:
    leetcode -- Add Binary
    leetcode -- 4sum
    leecode -- 3sum Closet
    C++单例模式
    MapReduce的模式、算法和用例
    react 学习笔记
    css3 文字过长用...代替
    scss/css 中添加ie hack
    springmvc 解决跨域CORS
    springmvc 添加Junit4
  • 原文地址:https://www.cnblogs.com/rynnwang/p/2517165.html
Copyright © 2011-2022 走看看