CSS hack

CSS hack

一、我不多使⽤hacker的，多是个⼈习惯吧，我不喜欢写的代码IE不兼容，而后⽤hack来解决。不过hacker仍是⾮常好⽤ 的。使⽤hacker我能够把浏览器分为3类：IE6 ；IE7和遨游；其余（IE8 chrome ff safari opera等）

 

◆IE6认识的hacker 是下划线_ 和星号 *

 

◆IE7 遨游认识的hacker是星号 *

 

 

 

⽐如这样⼀个CSS设置：height:300px;*height:200px;_height:100px;

 

IE6浏览器在读到height:300px的时候会认为⾼时300px；继续往下读，他也认识*heihgt， 因此当IE6读到*height:200px的

 

时候会覆盖掉前⼀条的相冲突设置，认为⾼度是200px。继续往下读，IE6还认识_height,因此他⼜会覆盖掉200px⾼的设 置，把⾼度设置为100px；

 

 

 

IE7和遨游也是⼀样的从⾼度300px的设置往下读。当它们读到*height200px的时候就停下了，由于它们不认识_height。 因此它们会把⾼度解析为200px，剩下的浏览器只认识第⼀个height:300px;因此他们会把⾼度解析为300px。由于优先级 相同且想冲突的属性设置后⼀个会覆盖掉前⼀个，因此书写的次序是很重要的。

 

2.条件注释

 

<!--[if lte IE 6]> 这段⽂字仅显⽰在 IE6及IE6如下版本。 <![endif]--> <!--[if gte IE 6]> 这段⽂字仅显⽰在 IE6及IE6以上版本。 <![endif]-->

 

<!--[if gt IE 6]> 这段⽂字仅显⽰在 IE6以上版本（不包含IE6）。 <![endif]--> <!--[if IE 5.5]> 这段⽂字仅显⽰在 IE5.5。 <![endif]-->

 

<!--在 IE6及IE6如下版本中加载css-->

 

<!--[if lte IE 6]> <link type="text/css" rel="stylesheet" href="css/ie6.css" mce_href="css/ie6.css" /><![endif]-->

 

缺点是在IE浏览器下可能会增长额外的HTTP请求数。