IE6、IE7、IE8、Firefox适配性CSS HACK编码及示例

日期:2021-03-09 类型:科技新闻 

关键词:图片模板,淘宝作图用什么软件好,在线制作白底图,设计图制作软件,抠图软件

1.差别IE和非IE访问器CSS HACK编码


拷贝编码
编码以下:

#divcss5{
background:blue; /*非IE 情况藍色*/
background:red \9; /*IE6、IE7、IE8情况紅色*/
}

2.差别IE6,IE7,IE8,FF CSS HACK
【差别标记】:「\9」、「*」、「_」
【示例】:


拷贝编码
编码以下:

#divcss5{
background:blue; /*Firefox 情况变蓝色*/
background:red \9; /*IE8 情况变鲜红色*/
*background:black; /*IE7 情况变黑色*/
_background:orange; /*IE6 情况变橘色*/
}

【表明】:由于IE系列访问器可读「\9」,而IE6和IE7可读「*」(米字号),此外IE6可辨识「_」(底线),因而能够按照次序写下来,就会让访问器正确的载入到自身看得晓得CSS英语的语法,因此便可以合理区别IE各版本号和非IE访问器(好像Firefox、Opera、Google Chrome、Safari等)。

3.差别IE6、IE7、Firefox (EXP 1)
【差别标记】:「*」、「_」
【示例】:


拷贝编码
编码以下:

#divcss5{
background:blue; /*Firefox情况变蓝色*/
*background:black; /*IE7 情况变黑色*/
_background:orange; /*IE6 情况变橘色*/
}

【表明】:IE7和IE6可读「*」(米字号),IE6又能够读「_」(底线),可是IE7却没法载入「_」,至于Firefox(非IE访问器)则彻底没法辨识「*」和「_」,因而便可以透过这样的差别性来区别IE6、IE7、Firefox

4.差别IE6、IE7、Firefox (EXP 2)
【差别标记】:「*」、「!important」
【示例】:


拷贝编码
编码以下:

#divcss5{
background:blue; /*Firefox 情况变蓝色*/
*background:green !important; /*IE7 情况变翠绿色*/
*background:orange; /*IE6 情况变橘色*/
}

【表明】:IE7能够辨识「*」和「!important」,可是IE6只能够辨识「*」,却没法辨识「!important」,至于Firefox能够载入「!important」但不可以辨识「*」因而能够透过这样的差别来合理区隔IE6、IE7、Firefox。

5.差别IE7、Firefox
【差别标记】:「*」、「!important」
【示例】:


拷贝编码
编码以下:

#divcss5{
background:blue; /*Firefox 情况变蓝色*/
*background:green !important; /*IE7 情况变翠绿色*/
}

【表明】:由于Firefox能够辨识「!important」但却没法辨识「*」,而IE7则能够另外看懂「*」、「!important」,因而能够两个辨识标记来区隔IE7和Firefox。

6.差别IE6、IE7 (EXP 1)
【差别标记】:「*」、「_」
【示例】:


拷贝编码
编码以下:

#tip {
*background:black; /*IE7 情况变黑色*/
_background:orange; /*IE6 情况变橘色*/
}

【表明】:IE7和IE6都可以以辨识「*」(米字号),但IE6能够辨识「_」(底线),IE7却没法辨识,透过IE7没法载入「_」的特点就可以轻鬆区隔IE6和IE7之间的差别。

7.差别IE6、IE7 (EXP 2)
【差别标记】:「!important」
【示例】:

表明】:由于IE7可载入「!important;」但IE6却不好,而CSS的载入流程是从上到下,因而IE6载入时因没法辨识「!important」而立即跳到下1行载入CSS,因此情况色会展现橘色。

8.差别IE6、Firefox
【差别标记】:「_」
【示例】:


拷贝编码
编码以下:

#divcss5{
background:black; /*Firefox 情况变黑色*/
_background:orange; /*IE6 情况变橘色*/
}

【表明】:由于IE6能够辨识「_」(底线),可是Firefox却不好,因而能够透过这样的差别来区隔Firefox和IE6,合理达到CSS hack。

以上包含了IE6\IE8\IE7\火狐访问器适配难题及处理方式。

上一篇:本文的主角 vertical 返回下一篇:没有了