CSS Hack技术语法宝典

开发 前端
CSS hack由于不同的浏览器,比如Internet Explorer 6,Internet Explorer 7,Mozilla Firefox等,对CSS的解析认识不一样,因此会导致生成的页面效果不一样。

本文向大家描述一下CSS hack概念,工作原理和写法,针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览器,能在不同的浏览器中也能得到我们想要的页面效果。这个针对不同的浏览器写不同的CSS code的过程,就叫CSS hack,也叫写CSS hack。

CSS Hack简介

CSS hack由于不同的浏览器,比如Internet Explorer 6,Internet Explorer 7,Mozilla Firefox等,对CSS的解析认识不一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。

这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览器,能在不同的浏览器中也能得到我们想要的页面效果。这个针对不同的浏览器写不同的CSS code的过程,就叫CSS hack,也叫写CSS hack。

CSS Hack的原理是什么

  由于不同的浏览器对CSS的支持及解析结果不一样,还由于CSS中的优先级的关系。我们就可以根据这个来针对不同的浏览器来写不同的CSS。   

比如 IE6能识别下划线"_"和星号" * ",IE7能识别星号" * ",但不能识别下划线"_",而firefox两个都不能认识等等 。书写顺序,一般是将识别能力强的浏览器的CSS写在后面。下面如何写里面说得更详细些。

如何写CSS Hack

  比如要分辨IE6和firefox两种浏览器,可以这样写: 

  1. <style>     
  2. iv{     
  3. background:green; /* for firefox */     
  4. *background:red; /* for IE6 */     
  5. }     
  6. </style>    
  7.  

我在IE6中看到是红色的,在firefox中看到是绿色的。   

解释一下:   

上面的CSS在firefox中,它是认识不了后面的那个带星号的东东是什么的,于是将它过滤掉,不予理睬,解析得到的结果是:div{background:green},于是理所当然这个div的背景是绿色的。

【编辑推荐】

  1. IE8浏览器中正式版CSS hack技术用法
  2. CSS display:inline和float:left两者区别
  3. 深入探究DIV CSS布局中position属性用法
  4. CSS Hack工作原理及编写方式
  5. CSS display:block显示布局错乱解决方案

 

责任编辑:佚名 来源: hi.baidu.com
相关推荐

2010-09-16 11:02:56

CSS padding

2010-09-15 15:27:06

CSS hack

2010-09-15 16:19:17

IECSS hack

2010-09-16 13:48:15

CSS Hack

2009-10-26 13:36:58

VB.NET Spli

2010-09-01 10:17:38

CSShack注释

2010-09-07 13:04:14

CSS Hack

2010-09-16 14:09:03

CSS hackGoogleChrom

2010-09-15 16:29:20

CSS hackIE8

2010-09-15 15:59:11

CSS hack

2010-09-15 15:39:03

CSS hack

2010-09-15 16:48:51

IE8CSS hack

2015-06-12 11:26:02

CSS浏览器 CSS Hac

2010-09-13 13:27:25

CSS滤镜

2021-12-30 11:15:48

服务器开发设计

2010-09-15 15:48:09

CSS Hack

2010-08-25 09:30:56

marginCSS

2010-09-06 13:59:23

CSS缩写

2010-09-06 13:15:48

CSS定位

2013-03-12 10:01:21

WebCSSJS
点赞
收藏

51CTO技术栈公众号