什么是css  hank

  由于不同厂商的流览器或某浏览器的不同版本(如IE6-IE11,Firefox/Safari/Opera/Chrome等),对CSS的支持、解析不一样,导致在不同浏览器的环境中呈现出不一致的页面展现效果。这时,我们为了获得统一的页面效果,就需要针对不同的浏览器或不同版本写特定的CSS样式,我们把这个针对不同的浏览器/不同版本写相应的CSS code的过程,叫做CSS hack!

css   hank的类型
  有三种表现形式,css属性前缀法,选择器前缀法,以及IE条件注释法。

css属性前缀法

IE6+ css hack:

Selector { _property: value; }
IE7+ css hack:

Selector { *+property: value; }
IE8+ css hack:

Selector { property: value\0; }
IE9+ css hack:

Selector { property: value\9\0; }

选择器前缀法:

是针对一些页面表现不一致或者需要特殊对待的浏览器,在CSS选择器前加上一些只有某些特定浏览器才能识别的前缀进行hack。
目前最常见的是
html 前缀只对IE6生效
+html +前缀只对IE7生效
@media screen\9{...}只对IE6/7生效
@media \0screen {body { background: red; }}只对IE8有效
@media \0screen\,screen\9{body { background: blue; }}只对IE6/7/8有效
@media screen\0 {body { background: green; }} 只对IE8/9/10有效
@media screen and (min-width:0\0) {body { background: gray; }} 只对IE9/10有效
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {body { background: orange; }} 只对IE10有效

IE条件注释法:

<!–[if !IE]><!–> 除IE外都可识别 <!–<![endif]–>
<!–[if IE]> 所有的IE可识别 <![endif]–>
<!–[if IE 6]> 仅IE6可识别 <![endif]–>
<!–[if lt IE 6]> IE6以及IE6以下版本可识别 <![endif]–>
<!–[if gte IE 6]> IE6以及IE6以上版本可识别 <![endif]–>

CSS HACK 如何书写的更多相关文章

  1. CSS- ie6,ie7,ie8 兼容性写法,CSS hack写法

    css ie6,ie7,ie8 兼容性写法,CSS hack写法 margin-bottom:40px;       /*ff的属性*/margin-bottom:140px\9;    /* IE6 ...

  2. CSS hack方式一览【转】

    做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道 ...

  3. Web前端技术研究:Css hack技术---令人沮丧的技术

    我最近想好好整理下csshack技术,但是结果很沮丧,下面我将我最初写的笔记和大家分享下. 我在单位整理的研究笔记: 不同的浏览器对某些CSS代码解析会存在一定的差异,因此就会导致不同浏览器下给用户展 ...

  4. CSS选择器、CSS hack及CSS执行效率

    主要内容: 1.CSS选择器.优先级与匹配原理 2. CSS 引入的方式有哪些 ? link 和 @import 的区别是 ? 3.CSS hack 4.如何书高效CSS  一.CSS选择器.优先级与 ...

  5. css样式 --- CSS hack

    前端样式,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道一 ...

  6. 史上最全的CSS hack方式一览

    做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道 ...

  7. [转]史上最全的CSS hack方式一览

    做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道 ...

  8. CSS Hack相关知识

    CSS Hack 1.由于不同厂商的浏览器,比如Internet Explorer,Safari,Chrome,Mozila Firefox等,或者是同一厂商的浏览器的不同版本,如IE6和IE7,对C ...

  9. 转 CSS hack:针对IE6,IE7,firefox显示不同效果

    CSS hack:针对IE6,IE7,firefox显示不同效果 做网站时经常会用到,衡量一个DIV+CSS架构师的水平时,这个也很重要. 区别不同浏览器的CSS hack写法: 区别IE6与FF:  ...

随机推荐

  1. 欢迎使用IdentityModel文档!- IdentityModel 中文文档(v1.0.0)

    IdentityModel是基于声明的身份,OAuth 2.0和OpenID Connect的.NET标准帮助程序库. 它具有以下高级功能: 标准OAuth 2.0和OpenID Connect端点的 ...

  2. DS控件库 Win7链接列表框的仿Windows开始菜单样式

    Win7链接列表框是依照Windows7的开始菜单开发的,同时进行了属性和功能的扩展. 效果图 项属性 控件属性 控件主要事件 点击项(Sender As Win7链接列表框, Itm As 链接项, ...

  3. 全网首发! Odoo 订单分解执行及供应链管理免费开源解决方案

    引言 前一篇介绍了佛山王朝家具的案例背景.佛山王朝家具公司在全国有30多家门店,三个生产工厂.王朝家具有六大痛点问题: 订单迫切需要实现电子化管理及在线签名 总部分单工作量大,供应链效率低 配送和售后 ...

  4. 免费下载获取Odoo中文实施 应用 指南 手册

    引言 Odoo,以前叫OpenERP,是比利时Odoo S.A.公司开发的一个企业应用软件套件,开源套件包括一个企业应用快速开发平台,以及几千个Odoo及第三方开发的企业应用模块.Odoo适用于各种规 ...

  5. Android之日志管理(Log)

    ##文章大纲一.为什么要使用日志管理工具二.日志管理工具实战三.项目源码下载 ##一.为什么要使用日志管理工具###1. 对IT安全至关重要  当您使用强大的日志管理软件自动触发以保护您的系统时,您已 ...

  6. Sqlserver 事务处理模板

    USE StuDB GO /****** Object: StoredProcedure [dbo].[proc_live_send_answer_v4] Script Date: 06/20/201 ...

  7. SQLite 的 EXISTS 与 NOT EXISTS

    话不多说先来看看表结构: 显而易见 Pid 存放的 Person 的 id :下面重点(奇葩需求!!!!) 我需要向表一(Person)里插入几条数据(...)这时候不会对表二做任何操作. 需求:查询 ...

  8. 一文搞懂RAM、ROM、SDRAM、DRAM、DDR、flash等存储介质

    一文搞懂RAM.ROM.SDRAM.DRAM.DDR.flash等存储介质 存储介质基本分类:ROM和RAM RAM:随机访问存储器(Random Access Memory),易失性.是与CPU直接 ...

  9. Mysql中concat()、concat_ws()和 group_concat()的用法

    一.CONCAT()函数CONCAT()函数用于将多个字符串连接成一个字符串.使用数据表Info作为示例,其中SELECT id,name FROM info LIMIT 1;的返回结果为+----+ ...

  10. Python算法和数据结构:在二叉树中找到和为sum的所有路径

    玄魂工作室秘书 [玄魂工作室] 思路:先用递归创建一颗二叉树,作为输入:然后对这课二查树进行递归遍历,递归中每遍历一个节点,下次递归的和为sum-data;并用一个数组记录遍历过的路径,当存在sum时 ...