hack是主要来处理IE的兼容,不同的IE,不同的兼容方式

/*
  属性前缀法(即类内部Hack):
   
  *color:#000; *号对IE6,IE7都生效
  +color:#555; +号对IE6--IE10都生效
  -color:#999; -号只对IE6生效
   _color:#888; _下划线只对IE6生效
  color:red\9;\9对 IE6/IE7/IE8/IE9/IE10都生效
  color:blue\0; \0对IE8/IE9/IE10都生效,是IE8/9/10的hack
  color:green\9\0; \9\0 只对IE9/IE10生效,是IE9/10的hack
   #color:pink; #号对IE6/IE7/IE8/IE9/IE10都生效
   
  */

看看怎么用的,来吧

  width: 300px\9;
  *width: 800px;
  _width: 300px;
   
  height: 120px;
  height: 60px\9;
  *height: 80px;
  _height: 100px;
  color: #FF6900;
  color: red\9;
  *color: deepskyblue;
  _color: #000;
  /*color:blue;*/
   
  background: #aaa;
  background: #ddd\9;
  *background: red;
  _background: #aaa;
  box-shadow: 0 0 5px #555;
  box-shadow: 0 0 5px #555\9;
  *box-shadow: 0 0 5px #555;
  _box-shadow: 0 0 5px #555;
  /*border: 1px solid #FF6900;*/
  /*border: 4px solid red\9;*/
  /**border: 8px solid deepskyblue;*/
  /*_border: 12px solid #000;*/
  text-align: center;
  line-height: 100px;

他也支持选择器的hack:

CSS选择器的Hack
   
  *html: 在选择器前面加 *html 表示该样式在IE6以及IE6以下版本浏览器生效
  :root: 在选择器前面加 :root 表示该样式在IE9及以上版本浏览器生效,对firefox和chrome也生效
  *+html: 在选择器前面加 *+html 表示该样式仅仅在IE7版本浏览器生效
  html>body: 在选择器前面加 html>body 表示该样式除IE6之外的所有浏览器都生效

例子:

*/
   
  *html .a {
  color:#fff;
  }
   
  :root .a {
  /*color: blue;*/
  }
  *+html .a{
  /*color:#ff6900;*/
  }
  html>body .a {
  color: green;
  }

Hack还支持html文本格式的兼容,意思是他可以找到你所匹配的IE版本,然而他并不是注释,第一次用它的话,哈哈哈,有可能你会觉得他是个注释,

同时也支持大于某一个版本,或者小于It某一个ie版本

<!--IE条件注释法(即HTML条件注释Hack)-->
  <!--[if IE]>
  <p>所有IE浏览器显示</p>
  <![endif]-->
   
  <!--[if IE 7]>
  <p>IE7浏览器显示,数字可以改 ,比如改成8,就是IE8浏览器显示</p>
  <![endif]-->
   
  <!--[if gte IE 6]>
  <p>IE6以上(包括)浏览器显示,数字可以改 ,比如改成7,就是IE7以上(包括)浏览器显示</p>
  <![endif]-->
   
  <!--[if ! IE 8]>
  <p>非IE8浏览器显示,数字可以改 ,比如改成9,就是非IE9浏览器显示</p>
  <![endif]-->
   
  <!--[if !IE]>
  <p>非IE浏览器显示</p>
  <![endif]-->

同理,在head里面,我们也可以写IE的兼容,例子来了

  <!--[if It IE 9]>
            <style>
      body{
        background-image: url(img/3.png);
        }
    </style>
    <![endif]-->
 
 
 
 
OK,关于hack的兼容应该差不多了,具体到某一个属性的兼容还需要继续查找,坑逼的IE

主要讲下hack的兼容用法,比较浅,哈哈的更多相关文章

  1. CentOS7下Firewall防火墙配置用法详解

    官方文档地址: https://access.redhat.com/documentation/en-US/Red_Hat_Enterprise_Linux/7/html/Security_Guide ...

  2. linux下find查找命令用法

    Linux下find命令在目录结构中搜索文件,并执行指定的操作.Linux下find命令提供了相当多的查找条件,功能很强大.由于find具有强大的功能,所以它的选项也很多,其中大部分选项都值得我们花时 ...

  3. IE6/IE7下margin-bottom失效兼容解决办法及双倍边距问题

    (从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-04-08) 一.IE6/IE7下margin-bottom失效兼容解决办法 1.用padding-bottom代替:2.在 ...

  4. Asp.net服务器控件在IE10下的不兼容问题

    Asp.net服务器控件在IE10下的不兼容问题 时间:2013-05-16 09:07点击: 89 次 [大 中 小] 相信很多使用IE10的童鞋们已经发现了这个问题,以下是本人在IE10标准模式下 ...

  5. IE6-7下margin-bottom不兼容解决方法(非原创,视频中看到的)

    在IE低版本下有很多不兼容,现在将看到的   IE6-7下margin-bottom不兼容解决方法   演示一下,方便日后自己查阅. <!DOCTYPE html> <html la ...

  6. FCKEditor在IE10下的不兼容问题解决方法

    环境介绍:FCKEditor 版本 2.x.x 问题:IE10 下FCKEditor不兼容,显示不出来 关键词:不同于其他方法之处是第一个关键点,其他网友的正则表达式不对 解放方法:(可以直接< ...

  7. Scala中_(下划线)的常见用法

    Scala中_(下划线)的常见用法 地址:https://www.jianshu.com/p/0497583ec538

  8. windows和linux下目录分隔符兼容问题(换行回车兼容)

    windows和linux下目录分隔符兼容 DIRECTORY_SEPARATOR 换行回车兼容 PHP_EOF

  9. Bootstrap历练实例:导航内下拉菜单的用法

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

随机推荐

  1. Java:双括号初始化 /匿名内部类初始化法

    偶然见到一种初始化方式,感到十分新奇: //新建一个列表并赋初值A.B.C ArrayList<String> list = new ArrayList<String>() { ...

  2. 纳税服务系统【统计图Fusionchart】

    需求 我们在投诉模块中还有一个功能没有实现: 统计:根据年度将相应年度的每个月的投诉数进行统计,并以图表的形式展示在页面中:在页面中可以选择查看当前年度及其前4年的投诉数.在页面中可以选择不同的年度, ...

  3. Jquery第二篇【选择器、DOM相关API、事件API】

    前言 前面已经介绍过了Jquery这门语言,其实就是一个javaScript的库-能够简化我们书写的代码-.本博文主要讲解使用Jquery定位HTML控件[定位控件就是获取HTML的标签],使用Jqu ...

  4. mariadb自带命令行客户端指令笔记

    mysql -H 主机IP -u 用户名 -p -p表示要输密码,不要直接输了,要回车后在程序里输入 显示数据库列表: show databases; 选择XX数据库: use XX; 显示数据库里的 ...

  5. 框架应用:Spring framework (四) - 事务管理

    事务控制 事务是什么?事务控制? 事务这个词最早是在数据库中进行应用,讲的用户定义的一个数据库操作序列,这些操作要么全做要么全不做,是一个不可分割的工作单位. 事务的管理是指一个事务的开启,内容添加, ...

  6. PuTsangTo-单撸游戏开发03 碰撞与跳跃瑕疵版

    继续上一部分,游戏的定位是横版平台动作类游戏,所以得有跳跃动作,首先想到的就是物理引擎,不过在2D游戏里,仅为了角色的跳跃而引入物理引擎,目前想来有些不至于,仅使用cocos默认带有的碰撞系统也足够了 ...

  7. 【京东账户】——Mysql/PHP/Ajax爬坑之产品列表显示

    一.引言 实现京东的账户项目,功能模块之一,产品列表显示.要用到的是Apach环境,Mysql.PHP以及Ajax. 二.依据功能创建库.表.记录 创建库:jd 创建表:产品表 添加多条记录 /**产 ...

  8. 使用STS时遇到的小“麻烦”

    背景 今天尝试着用STS(Spring Tool Suite)建立了一个Maven webapp来做一个SpringMVC的小demo,在使用的过程中就遇到了一些小麻烦!!记录在此的目的,其一是为了自 ...

  9. git添加比较和合并工具(meld)

    git 下的(difftool)和(mergetool)是专门提供给使用者用自己的工具进行diff和merge的命令: # git config --global diff.tool meld # g ...

  10. FPGA在其他领域的应用(四)

    工业领域: 从工厂和过程自动化到能源基础设施和机器视觉系统,工业产品有助于改善我们的世界.产品必须安全.可靠.适应性强,而且耐用.同时,商业成功要求你在激烈竞争的市场中行动迅速,同时降低总成本. 英特 ...