米葫芦网

CSS hack是什么?IE689浏览器的CSS hack大全介绍

热度:1℃ 发布时间:2024-07-03 01:14:23

1、常见的特殊符号的应用:

IE6:

_selector{property:value;}

selector{property:value;property:value !important;} //IE6 不支持同一选择符中的 !important

IE7:

+selector{property:value;}

IE8:

selector{property:value;}

IE6 & IE7:

*selector{property:value;}

IE6 & IE7 & IE8:

selector{property:value9;}

总结起来,如下:

其中,S表示Standards Mode即标准模式,Q表示Quirks Mode,即兼容模式。

2、条件注释语句( )

所有的IE可识别

仅IE6可识别

IE6以及IE6以上版本可识别

IE7以下版本可识别

lt 表示less than 当前条件版本以下的版本,不包含当前版本。

gte 表示greeter than or equal 当前版本以上版本,并包含当前版本。

lte 表示less than or equal 当前版本以下版本,并包含当前版本。

3、meta声明

由于IE8 可能会将页面按照 IE7 模式进行渲染,针对 多版本IE的现状,通常会采用设置 X-UA-Compatible HTTP 头的方式将页面在IE中采用统一的渲染模式。

CSS hack是什么?IE689浏览器的CSS hack大全介绍

4、其他(/***/注释法)

网上也流传着这样一种ie hack方法

.color1{ color:#F00; color/***/:#00F /***/}/*IE6,IE7,IE8,FF,OP,SA识别*/

.color2{ color:#F00; color /***/:#00F /*9**/}/*IE7,IE8,FF,OP,SA识别*/

.color3{ color:#F00; color/***/:#00F 9}/*IE6,IE7,IE8识别*/

.color4{ color:#F00; color /***/:#00F9}/*IE7,IE8识别*//*“color”和“/***/”之间有个空格*/

分析下:

background-color:blue; 各个浏览器都认识,这里给firefox用;

background-color:red9;9所有的ie浏览器可识别;

background-color:yellow; 是留给ie8的,但笔者测试,发现最新版opera也认识,汗。。。不过且慢,后面自有hack写了给opera认的,所以,我们就认为是给ie8留的;

+background-color:pink; + ie7定了;

_background-color:orange; _专门留给神奇的ie6;

:root #test { background-color:purple9; } :root是给ie9的,网上流传了个版本是 :root #test { background-color:purple;},呃。。。这个。。。,新版opera也认识,所以经笔者反复验证最终ie9特有的为:root 选择符 {属性9;}

@media all and (min-width:0px){ #test {background-color:black;} } 这个是老是跟ie抢着认的神奇的opera,必须加个,不然firefox,chrome,safari也都认识。。。

@media screen and (-webkit-min-device-pixel-ratio:0){ #test {background-color:gray;} }最后这个是浏览器新贵chrome和safari的。

好了就这么多了,特别注意以上顺序是不可以改变的。css hack虽然可以解决个浏览器之间css显示的差异问题,但是毕竟不符合W3C规范,我们平时写css最好是按照标准来,这样对我们以后维护也是大有好处的,实在不行再用。

区别不同浏览器的CSS hack写法:

区别IE6与FF:

background:orange;*background:blue;

区别IE6与IE7:

background:green !important;background:blue;

区别IE7与FF:

background:orange; *background:green;

区别FF,IE7,IE6:

background:orange;*background:green !important;*background:blue;

注:IE都能识别*;标准浏览器(如FF)不能识别*;

IE6能识别*,但不能识别 !important,

IE7能识别*,也能识别!important;

FF不能识别*,但能识别!important;

CSS hack是什么?IE689浏览器的CSS hack大全介绍

另外再补充一个,下划线"_",

IE6支持下划线,IE7和firefox均不支持下划线。

CSS hack是什么?IE689浏览器的CSS hack大全介绍

于是大家还可以这样来区分IE6,IE7,firefox

: background:orange;*background:green;_background:blue;

注:不管是什么方法,书写的顺序都是firefox的写在前面,IE7的写在中间,IE6的写在最后面。

网友评论
评论
发 布

更多软件教程
  • 软件教程推荐
更多+
Greenfoot设置中文的方法

Greenfoot设置中文的方法

Greenfoot是一款简单易用的Java开发环境,该软件界面清爽简约,既可以作为一个开发框使用,也能够作为集成开发环境使用,操作起来十分简单。这款软件支持多种语言,但是默认的语言是英文,因此将该软件下载到电脑上的时候,会发现软件的界面语言是英文版本的,这对于英语基础较差的朋友来说,使用这款软件就会...

07-05

Egret UI Editor修改快捷键的方法

Egret UI Editor修改快捷键的方法

Egret UI Editor是一款开源的2D游戏开发代码编辑软件,其主要功能是针对Egret项目中的Exml皮肤文件进行可视化编辑,功能十分强大。我们在使用这款软件的过程中,可以将一些常用操作设置快捷键,这样就可以简化编程,从而提高代码编辑的工作效率。但是这款软件在日常生活中使用得不多,并且专业性...

07-05

KittenCode新建项目的方法

KittenCode新建项目的方法

KittenCode是一款十分专业的编程软件,该软件给用户提供了可视化的操作界面,支持Python语言的编程开发以及第三方库管理,并且提供了很多实用的工具,功能十分强大。我们在使用这款软件进行编程开发的过程中,最基本、最常做的操作就是新建项目,因此我们很有必要掌握新建项目的方法。但是这款软件的专业性...

07-05

Thonny设置中文的方法

Thonny设置中文的方法

Thonny是一款十分专业的Python编辑软件,该软件界面清爽简单,给用户提供了丰富的编程工具,具备代码补全、语法错误显示等功能,非常的适合新手使用。该软件还支持多种语言,所以在下载这款软件的时候,有时候下载到电脑中的软件是英文版本的,这对于英语基础较差的小伙伴来说,使用这款软件就会变得十分困难,...

07-05

最新软件下载