!important在ie7.0的hack方法

由于ie对!important识别存在bug,而现在大部分网页标准设计师又通过这个bug来兼容ie和ff,但是ie7.0把这个bug给修复了,所以问题又出现了,怎么兼容ie.7.0的同时又能兼容ie6.0和ff?正所谓"上有政策,下有对策",国外的网页标准设计师通过使用css filter的办法(并不是css hack)来兼容ie7.0,ie6.0和ff,以下为我从国外网站的翻译.

新建一个css样式如下：

#item {
width: 200px;
height: 200px;
background: red;
}

新建一个div,并使用前面定义的css的样式：

<div id="item">some text here</div>

在body表现这里加入lang属性,中文为zh：

<body lang="en">

现在对div元素再定义一个样式：

*:lang(en) #item{
background:green !important;
}

这样做是为了用!important覆盖原来的css样式,由于:lang选择器ie7.0并不支持,所以对这句话不会有任何作用,于是也达到了ie6.0下同样的效果,但是很不幸地的是,safari同样不支持此属性,所以需要加入以下css样式：

#item:empty {
background: green !important
}

:empty选择器为css3的规范,尽管safari并不支持此规范,但是还是会选择此元素,不管是否此元素存在,现在绿色会现在在除ie各版本以外的浏览器上,并在以下浏览器和操作系统下通过测试：

ie7 beta 2 preview/win
ie5.01+/win
firefox 1.5/win
opera 8.5/win & linux
netscape 7.01, 8/win
mozilla 1.7.12/win & linux
safari 2/mac
firefox 1.0.4/linux
epiphany 1.4.8/linux
galeon 1.3.20/linux

按照远作者的说法其实这不能算是一种hack,应该属于filter,不过这似乎并不是最重要的,因为通过这个办法,我们又一次了解决IE6.0,IE7.0和其他浏览器之间的兼容性问题,而且使用:lang-filter这办法,在今后的一段时间内都会有用 。

赞 (0)

相关推荐

  • !important在ie7.0的hack方法

    由于ie对!important识别存在bug,而现在大部分网页标准设计师又通过这个bug来兼容ie和ff,但是ie7.0把这个bug给修复了,所以问题又出现了,怎么兼容ie.7.0的同时又能兼容ie6.0和ff?正所谓"上有政策,下有对策",国外的网页标准设计师通过使用css filter的办法(并不是css hack)来兼容ie7.0,ie6.0和ff,以下为我从国外网站的翻译. 新建一个css样式如下: #item { width: 200px; height: 200px; ba

  • CSS hack实现 CSS完美兼容IE6/IE7/FF的通用方法

    关于CSS对各个浏览器兼容已经是老生常谈的问题了, 网络上的教程遍地都是.以下内容没有太多新颖, 纯属个人总结, 希望能对初学者有一定的帮助. 一.CSS HACK 以下两种方法几乎能解决现今所有HACK. 1, !important 随着IE7对!important的支持, !important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.) <style> #wrapper { width: 100px!important; /* IE7+FF */ width: 

  • 一个针对IE7的CSS Hack

    IE7 修复了很多 bug,也增加了对一些选择符的支持,所以现在诸如 *html {} 和 html>body {} 等针对 IE 隐藏或显示的 hack 都会在 IE7 中失效.虽然 CSS Hack 不推荐使用,条件注释才是万无一失的过滤器,但是条件注释只能出现在 HTML 中,CSS Hack 还是有用武之地的.Nanobot 发现了一些针对 IE7 的 CSS Hack,具体就是: >bodyhtml**+html 这三种写法,其中前两种都是不合法的 CSS 写法,在标准兼容浏览器中被

  • hta编写的软件管理工具0.1(IE7.0测试通过)

    自定义分类,是归档文件,好比你可以把你的工具分为渗透.溢出.网马.浏览之类的,可无限建分类 建好分类后,你可以进行第二步,根据你需要的后缀来进行分类,不建议将dll文件也分类,只把exe和webshell之类进行收集吧 第二步查找结束后,可以选择程序建立的SearchResult.txt,根据提示构选要存到哪一个分类,自动存进数据库 第三步当然是进行查找了,根据自定义sql语句查找你的工具 程序只是个雏形,可以提供建议,有时间再修正bug,进行软件升级 复制代码 代码如下: <HTML> &l

  • mysql取得datetime类型的数据,后面会跟个.0的实现方法

    mysql的数据类型是datetime,数据库里存的数据是2015-01-19 05:02:02,传到java这里变成了2015-01-19 05:02:02.0,多了个尾巴.0, 可以通过以下集中方法来format显示格式: 1.regtime的类型是date型的才能这样用,通过jstl来实现 <%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %> <fmt:format

  • Java去掉数字字符串开头的0三种方法(推荐)

    方式一: 例如:"0000123" (字符串必须全为数字) 处理过程: String tempStr = "0000123"; int result = Integer.parseInt(tempStr); result 结果:123 方式二: 例如:"0000123" 处理过程: String str = "0000123"; String newStr = str.replaceFirst("^0*",

  • Android 蓝牙2.0的使用方法详解

    本文为大家分享了Android操作蓝牙2.0的使用方法,供大家参考,具体内容如下 1.Android操作蓝牙2.0的使用流程 (1)找到设备uuid (2)获取蓝牙适配器,使得蓝牙处于可发现模式,获取下位机的socket,并且与上位机建立建立连接,获取获取输入流和输出流,两个流都不为空时,表示连接成功.否则是连接失败. (3).与下位机的socket开始通信. (4).通信结束后,断开连接(关闭流,关闭socket) 2接下来接直接上代码: 2.1找到设备uuid(一般厂商都会给开发者提供) 复

  • Android Studio 3.0被调方法参数名提示的取消方法

    Android Studio 3.0被调方法参数名提示的取消方法

    android studio升级3.0之后, 代码中调用的方法增加了参数名提示: 很多人不习惯这个提示,我们来看看怎么取消这个提示: PS:下面看下Android Studio 3.0 gradle提示太老 解决方法 The android gradle plugin version 3.0.0-alpha1 is too old, please update to the latest version. To override this check from the command line

  • vue2.0 datepicker使用方法

    1.使用vue-cli脚手架创建vue项目.在order列表页使用 vue-datepicker.按照文档操作,安装后,使用 myDatepicker from 'vue-datepicker'命令,导入组件.但是控制台提示 exports is not defined. 2.使用的是webpack包管理工具 1.导入代码 import myDatepicker from 'vue-datepicker' export default{ components: { VSelection, myD

  • mysql-8.0.17-winx64 部署方法

    mysql-8.0.17-winx64 部署方法

    1.官网下载mysql-8.0.17-winx64,选择Zip文件格式下载 2.解压到目标路径,我这里是E盘根目录,即E:\mysql8 3.根目录下创建my.ini,内容如下: [mysqld] #端口 port = 3306 #mysql安装目录 basedir = E:/mysql8 #mysql数据存放目录 datadir = E:/mysql8/data #允许最大连接数 max_connections = 1024 #服务端默认使用字符集 character-set-server =

随机推荐