什么是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. 关于Python3.6中Twisted模块安装的问题

    今天准备学习爬虫的scrapy模块,在这之前需要安装许多别的模块,Twisted就是其一 一开始想着直接用pycharm来安装就行了,没想到安装了一会就报错了,如下 后来就换到命令提示符来安装,在官网 ...

  2. OSPF 高级实验

    一.环境准备 1. 软件:GNS3 2. 路由:c7200 二.实验操作 实验要求: 1.理解 OSPF 虚链路原理及何时需要使用虚链路. 2.掌握 OSPF 虚链路配置方法. 3.掌握 OSPF 的 ...

  3. 【野草】SQL Server之索引解析(一)

    1.写在前面 微软专门给出SQL Server设计思路及实现路线,从7大体系结构阐述是如何实现,通过了解这些,我们就可以总结出数据库设计原则.编程中sql写法及注意事项,从而优化我们的系统性能,本系列 ...

  4. SqlServer_查看SQLServer版本信息

    方法一: 执行sql语句 SELECT @@VERSION 方法二: 连接SQL Server Management Studio利用Object Explorer显示的主要版本号信息,显示当前实例产 ...

  5. Win10常见问题记录

    基本信息 记录我在使用win10过程中遇到的一些问题 我所使用的两个win10系统 Win10 企业版 1607(家里电脑) Win10 专业版 1806(公司电脑) win10 开启Sets 请问您 ...

  6. Windows -- cmd命令: netstat 和 arp

    1. netstat: 显示网络连接.路由表和网络接口信息,可以让用户得知有哪些网络连接正在运作. 命令格式及参数如下: 2. ARP: 可用于查询本机ARP缓存中IP地址和MAC地址的对应关系.添加 ...

  7. 使用Chrome 中的 ssh 插件登陆 linux 服务器

    . 在chrome 商店中搜索 secure shell , 安装 Secure Shell Extension 2. 安装完成后,就可以在应用程式中找到Secure Shell App 3.点击 S ...

  8. Re:Unity游戏开发有哪些让你拍案叫绝的技巧?

    这是我在知乎一个问题: <Unity游戏开发有哪些让你拍案叫绝的技巧?> 下面的回答,觉得蛮有趣的,贴在这里和博客的朋友们分享下. ----- 分享一个比较好玩的内容吧. 大家都知道Uni ...

  9. Implement heap using Java

    public class HeapImpl { private int CAPACITY = 10; private int size = 0; private int[] data; public ...

  10. WPF 通过透明度遮罩和变换制作倒影效果

      倒影效果 代码 <Canvas xmlns="http://schemas.microsoft.com/client/2007" xmlns:x="http:/ ...