`
webcode
  • 浏览: 5944783 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

为ie6，ie7，firefox(ff)设置不同效果的css写法

FirefoxCSSIEHTML浏览器 
阅读更多

写css代码的时候经常会遇到ie和ff效果不一致的问题，就会用到css hack方法，ie7出现之前，ie是不支持!important 的，可以通过加!important 来为ie和firefox设置不同的css代码以达到相同的显示效果，当然也可以通过这个来达到不同的显示效果，但是ie7出现之后这个方法就不灵了，因为ie7支持!important ，用了!important 可能在ie7下的效果又不对了，出现这种情况的时候我们该怎么办呢？

当然如果你的css水平很高的话可能遇到此问题的可能性比较小，但是还是可能会出现这种问题的。由此问题产生了下面的兼容ie6，ie7，firefox的css hack写法：

#test { width:200px} /*FireFox*/

*html #test {width:220px} /*IE6*/

*+html #test {width:210px} /*IE7*/

为什么这种写法可以达到完美兼容ie6，ie7，ff呢，因为第一种写法三种浏览器都能识别，而firefox不能识别后面*html和*+html两种写法，所以在firefox下对应的有效代码是第一行代码，而*html是ie的特有的标签，*+html是ie7的特有的标签，ie6不支持*+html，所以ie6能识别第一行和第二行代码，再加上第二行代码覆盖了第一行代码的定义，因此在ie6下的有效代码就是第二行代码，ie7能识别三种写法，第三种覆盖了前两种，所以ie7下的有效代码就是第三行代码了，这样就做到了完美兼容ie6，ie7，firefox。

分享到：
| C runtime Library And Standard C++ Libr ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    css样式表兼容总结,兼容火狐,ie6,ie7,FF

    css样式表火狐,ie6,ie7,FF,

    css 简单区别ie6,ie7,firefox的写法

    同一样式里可以这样[code]margin:17px; FF +margin:17px; IE6 IE7 _margin:17px; IE6 [/code]按这个顺序，刚好区分开三个浏览器

    ie6ie7ie8共存以及Firefox浏览器CSS兼容写法

    在网站设计的时候，应该注意css样式兼容不同浏览器问题，特别是对完全使用DIVCSS设计的网，就应该更注意IE6IE7FF对CSS样式的兼容，不然，你的网乱可能出去不想出现的效果!Java中文网海量权威开发资料，欢迎游客会员...

    CSS hack 针对IE6，IE7，firefox显示不同效果

    区别不同浏览器的CSS hack写法： 区别IE6与FF： background:orange;*background:blue; 区别IE6与IE7： background:green !important;background:blue; 区别IE7与FF： background:orange; *background:green; ...

    Css样式兼容IE6,IE7,FIREFOX的浏览器的写法示例介绍

    根据FF和IE对一些符号识别的差异,我们可以单独对FF以及IE定义样式,例子: ... 区别FF，IE7，IE6： background:orange;*background:green !important;*background:blue; 注：IE都能识别*;标准浏览器(如FF)不能识别*； I

    区别各种IE浏览器的css写法

    2.区别IE6,IE7,IE8,FF 【区别符号】：「\9」、「*」、「_」 【示例】： 复制代码代码如下: #tip { background:blue; /*Firefox 背景变蓝色*/ background:red \9; /*IE8 背景变红色*/ *background:black; /*IE7 背景...

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

    一、CSS HACK 以下两种方法几乎能解决现今所有HACK. 1, !...2, IE6/IE77对FireFox *+html 与 *html 是IE特有的标签, firefox 暂不支持.而*+html 又为 IE7特有标签.<style>#wrapper{#wrapper {

    解决IE6、IE7、Firefox兼容比较简单的CSS Hack

    第一排给Firefox以及其他浏览器看 第二排给IE7（可能以后的IE8、IE9也是如此，谁知道呢）看 第三排给IE6以及更老的版本看 最好的应用就是可以让IE6也“支持”position:fixed，而且，配合这个原理，可以做到不引入...

    2010全面兼容多浏览器IE6-IE7-IE8-FF的CSS HACK写法

    还好，微软提供了这样一个代码： <meta http-equiv=”x-ua-compatible” content=”ie=7″ /> 把这段代码放到<...firefox能解析第一段，后面的两个因为前面加了特殊符号“*”和“_”,firefox

    全面兼容ie6,ie7,ie8,ff的最简单的css写法

    还好，微软提供了这样一个代码： 复制代码代码如下: <meta http-equiv=”x-ua-compatible” content=”ie=7″ />...解释一下吧： firefox能解析第一段，后面的两个因为前面加了特殊符号“*”和

    针对IE6的一些CSS Hack编写时的注意点小结

    区分出IE6的hack写法1.区别IE6、7与FF/IE8： JavaScript Code复制内容到剪贴板 background:blue;*background:orange;...引用显示效果：IE7/8/FF：greenIE6:blue原理：IE6支持下划线"_"，IE7、8和firefox均不支持下划

    浅析几个CSS3常用功能的写法

    所有代码都经过了Firefox 3.6和IE 8.0的验证。 一、圆角（Rounded Corner） 复制代码代码如下: .box_round { -moz-border-radius: 30px; /* FF1+ */ -webkit-border-radius: 30px; /* Saf3+, Chrome */ border-...

Magicbox
Global site tag (gtag.js) - Google Analytics