CSS hack

CSS hack

1、我很少使⽤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请求数。