注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

Aramey

前端开发

 
 
 

日志

 
 
 
 

各类浏览器的HACK写法和针对IE7的hack  

2013-11-04 10:50:18|  分类: 前端开发 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
主要针对浏览器各个版本专用的写法:

#test{
color:red;
color:red !important;/ Firefox、IE7支持 */
_color:red; / IE6支持 */
*color:red; / IE6、IE7支持 */
*+color:red; / IE7支持 */
color:red\9; / IE6、IE7、IE8支持 */
color:red\0; / IE8支持 */
}

一般的IE6和其他浏览器相对容易写兼容的代码,但是IE7有些自己特殊的怪癖,简直让人难以理解,这里我们只要记住“*+”这个符号集合体能有效的针对IE7这中诟病也就是我们程序员所理解的HACK。

其它专用的组合,只需通过上面的这些HACK来进行组合就能达到施主想要的结果。

针对IE8的css hack写法:

"\9″ 只在IE6/IE7/IE8/IE9/IE10下生效
"\0" 只在 IE8/IE9/IE10下生效
"\9\0" 只在IE9/IE10下生效


故目前如果需要只针对ie8的hack,可先使用在IE8/IE9/IE10生效的"\0",再用仅在IE9/IE10生效的"\9\0"hack覆盖之前的样式。


#test{
color:#000;
color:#F00\0; /* only for IE8&IE9&IE10 */
color:#000\9\0; /* only for IE9&IE10 */
}


IE8 最新写法

background:rgba(255,255,255,0.9) !important;*background:#FFF;background:#FFF;



1、如果你的页面对IE7兼容没有问题,又不想大量修改现有代码,同时又能在IE8中正常使用,微软声称,开发商仅需要在目前兼容IE7的网站上添加一行代码即可解决问题,此代码如下:
<meta http-equiv="x-ua-compatible" content="ie=7″ />
2、body:nth-of-type(1) 如果这样写,表示全局查找body,将会对应第一个<body>。
3、还有其他写法,比如:
*html #test{}或者 *+html #test{}
4、*+html 对IE7的HACK 必须保证HTML顶部有如下声明:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
5、顺序:Firefox、IE8、IE7、IE6依次排列。
  评论这张
 
阅读(344)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017