1. IE hacks:

"_"  是IE6 专有的hack;
"\9" 对IE6-IE10都有效;
"\0"对IE8-IE10都有效;
"\9\0"对IE9-IE10都有效;

优点:

CSS hacks 内嵌在普通的 CSS 里面,不会产生更多 HTTP 请求。CSS hacks 内嵌在普通的 CSS 里面,编写时比较方便。

缺点:

     它是不标准的产物。内嵌在其他 CSS 中,不便维护。尤其是当 hacks 的数量比较多的时候维护简直是个恶梦。内嵌在其他 CSS 中,即使在非 IE 浏览器中也会被加载,浪费资源。

2.条件注释 CSS:

<!--[if IE 6 ]>
   < link rel="stylesheet" type="text/css" media="all" href="./ie6.css" />
< ![endif]--> <!--[if lte IE 8 ]>
   <link rel="stylesheet" type="text/css" media="all" href="./assets/css/ie8.css" />
<![endif]-->

条件注释是一种 IE 专有的、对常规(X)HTML 注释的 Miscrosoft 扩展。从 W3C 标准来说,它也是不标准的产物,但它是微软官方推出的针对 IE 进行开发的方式,

  并且条件注释对于其他所有浏览器作为常规注释出现,因此对其他浏览器无害

优点:

  条件注释 CSS 的好处是在独立的 CSS 文件中编写,能准确控制在特定的 IE 中加载,不会造成资源浪费,并且便于维护。

缺点:

就是会产生多余的 HTTP 请求,尤其是当你需要兼容的 IE 版本很多的时候,你就需要产生多个 HTTP 请求,这对于本来通道数目就少的低版本 IE 来说无疑会影响页面加载速度。

                      以上两种方法不是很好,以下的方法相对来说会好点;

3.条件注释 html 标签:

  这种方案也是利用条件注释,但并不是对 CSS 使用条件注释,而是对 html 标签使用条件注释,引入不同的 class ,从而区分不同的 IE 以及其他浏览器;

<!DOCTYPE html>  
<!--[if IE 6 ]> <html class="ie6 lte_ie6 lte_ie7 lte_ie8" lang="zh-CN"> <![endif]-->  
<!--[if lte IE 6 ]> <html class="lte_ie6 lte_ie7 lte_ie8" lang="zh-CN"> <![endif]-->  
<!--[if lte IE 7 ]> <html class="lte_ie7 lte_ie8" lang="zh-CN"> <![endif]-->  
<!--[if lte IE 8 ]> <html class="lte_ie8" lang="zh-CN"> <![endif]-->  
<!--[if (gte IE 9)|!(IE)]><!--><html lang="zh-CN"><!--<![endif]-->  

   然后把对特定 IE 的 CSS 加上相应的 class 并写在普通 CSS 文件里即可: .ie6 .header .nav {margin:0 0 0 ;padding:0 0 0 0; }

  优点:

    条件注释表达式的好处在于不会产生多余的 HTTP 请求;

  缺点:

    由于这些针对特定 IE 的 CSS 与普通的 CSS 放在一起,即不是相应的 IE 也会被加载,因此如果 CSS 数目比较多的话就会像使用 hacks 那样,造成浪费;

                      以上方法:需要根据具体情况选择方法。

针对IE浏览器的CSS样式(兼容性)的更多相关文章

  1. 针对不同浏览器,CSS如何写

    我们在开发DIV+CSS页面时候常常会遇到开发出的网页的一些地方在各大浏览器比如微软IE6.微软IE7.微软IE8.火狐浏览器.谷歌浏览器有一些不同,如宽度.高度等地方有相差误.IE6比较老的版本浏览 ...

  2. 关于只针对ie7浏览器的css问题

    如代码: .centerDiv .search_k2{ margin-left: 18px; *margin-left: 9px; margin-top: 10px; height: 40px;} 中 ...

  3. style、currentStyle、getComputedStyle(不同浏览器获取css样式)区别介绍

    style.currentStyle.getComputedStyle区别介绍   样式表有三种方式 内嵌样式(inline Style) :是写在Tag里面的,内嵌样式只对所有的Tag有效. 内部样 ...

  4. 针对IE浏览器里面CSS的Bug解决方法

    IE6双倍边距bug 当页面内有多个连续浮动时,如本页的图标列表是采用左浮动,此时设置li的左侧margin值时,在最左侧呈现双倍情况.如外边距设置为10px, 而左侧则呈现出20px,解决它的方法是 ...

  5. 浏览器间CSS样式兼容问题

    1.display:table居中显示 在chrome和safari浏览器上兼容问题 2.滤镜 在chrome浏览器中能正常显示,在360浏览器中不能正常显示 3.省略号问题 对于一行显示,基本上对所 ...

  6. 修改chrome浏览器默认css样式的方法

    最近重新用起了ubuntu kylin,然后又碰到之前让我感到有些难受的一个小问题:用chrome浏览部分网页时,一部分粗体字十分难看,就像是宋体直接加粗那样. 之前就觉得这样看起来很难受,但是找到的 ...

  7. IE8 CSS样式兼容性清单

    IE8对于CSS2.1是完整支持的,对于CSS3则只是部分支持.下文中只列出IE8完全支持及完全不支持的样式,对于. 注:下文中的E.F均指html标签名,如p,img等. At-rules At类规 ...

  8. 针对铁定浏览器的css选择符

    /***** Selector Hacks ******/ /* IE6 and below */ * html #uno { color: red } /* IE7 */ *:first-child ...

  9. 有关css和js针对不同浏览器兼容的问题

    首先谈一下浏览器,虽然现在ie依然是浏览器市场的老大,大约占有67%的份额,但是由于其各方面的欠缺,用户开始选择其他浏览器作为自己浏览网页的主要 工具,比如firefox.theworld.maxth ...

随机推荐

  1. JAVA项目之苹果IAP内购JAVA服务器验证流程详解

    1.前言 本博客是经历过多个项目检验的, 绝对真实, 适应于对苹果iap内购稍微有些了解的JAVA开发人员,  认真看,  定能完美解决苹果内购问题. 苹果IAP内购支付实际上是"将客户端支 ...

  2. HotSpot虚拟机对象探秘

    参考:http://www.infoq.com/cn/articles/jvm-hotspot

  3. 如何写java求和源代码

    1.设计思想:利用eclipse编写. 2.程序流程图:先建立一个包->建立一个类->写代码->运行->修正错误,完善代码. 3.源程序代码: package dijia; p ...

  4. 3.BIND从服务器及缓存服务器配置

    一.域从服务器 一个域的从服务器(slave)通常是为了备份及负载均衡使用,所有这个域的信息都是由域的主服务器控制,域slave服务器启动时会从域的主服务器(master)上抓取指定域的zone配置文 ...

  5. fedora网络设置

    一:网络设置 1.找到要设置的网卡 命令:ip addr 列出所有的网络配置,找到你需要配置的网卡 入图,我这个是ens33 2.找到配置文件 配置文件路径: /etc/sysconfig/netwo ...

  6. Linux Shell 编程 教程 常用命令

    概述: Shell 是一个用 C 语言编写的程序,它是用户使用 Linux 的桥梁.Shell 既是一种命令语言,又是一种程序设计语言. Shell 是指一种应用程序,这个应用程序提供了一个界面,用户 ...

  7. Java Swing 简单介绍

    Swing 是一个为Java设计的GUI工具包. Swing是JAVA基础类的一部分. Swing包括了图形用户界面(GUI)器件如:文本框,按钮,分隔窗格和表. Swing提供许多比AWT更好的屏幕 ...

  8. 使用Jenkins自动编译 .net 项目

    使用Jenkins自动编译我的.net 项目   1.Jenkins是什么? Jenkins是一个可扩展的持续集成的引擎,主要用于持续自动的构建.测试软件项目 监控一些定时执行的任务.   2.安装配 ...

  9. 三:使用docker-machine安装虚拟机上的docker

    1.docker安装之后自带docker-machine:(需要win10专业版或mac) 2.如何远程管理一个docker-machine?(以下是Mac环境) 关闭本地的docker应用.运行do ...

  10. 第二篇 界面开发 (Android学习笔记)

    第二篇 界面开发 第5章 探索界面UI元素 ●The Android View Class     ●△Widget设计步骤 需要修改三个XML,以及一个class: 1)第一个xml是布局XML文件 ...