本文通过实例向大家描述一下IE6的CSS hack用法，我们以一个LOGO为实例，讲解了针对IE6，使用CSS HACK设置有别于IE7和FF的效果。具体内容请看本文详细引见，置信本文引见一定会让你有所收获。

一款针对IE6的CSS hack用法实例

CSS网页规划的兼容性问题不断困扰着大家，其实在51cto.com以前的文章中也有着丰富的CSS HACK与CSS兼容性的文章，只是有些文章可能讲的比较笼统而没有实例化，不便于大家的理解。

如今要讲解的是一个关于IE6的CSS HACK的用法。我们以一个LOGO为实例，讲解了针对IE6，使用CSS HACK设置有别于IE7和FF的效果。我们看下面的HTML代码：

ExampleSourceCode

<h3> 
<ahrefahref="http://www.51cto.com/"> 
我爱CSSCSSWebDesign-Web标准化Div+css教程</a> 
</h3> 
 

这是一个LOGO元素，使用H3标签进行组织，而LOGO图片则在CSS背景图片中进行定义。
看下面的CSS代码：

ExampleSourceCode 

body{  
margin:0;  
padding:0;  
}  
h3{  
margin:50pxauto;  
width:450px;  
height:60px;  
padding:5px;  
border:1pxdotted#03c;  
}  
h3a{  
display:block;  
width:450px;height:60px;  
text-indent:480px;  
white-space:nowrap;  
background:url(logo.jpg)no-repeat00;  
overflow:hidden;  
}  

设置BODY与H3的款式。将LOGO图片置于H3标签下面的链接元素中。我们打开查看到的效果如下：

我们再打开IE6查看，得到如下的效果：

　虚线不是那么美观了，显得非常粗糙，这时候我们该怎样办呢？我们可以针对IE6浏览器进行CSS HACK设置，定义在IE6下显示为不同的外观。

我们对CSS代码进行调整：

ExampleSourceCode

body{  
margin:0;  
padding:0;  
}  
h3{  
margin:50pxauto;  
width:450px;  
height:60px;  
padding:5px;  
border:1pxdotted#03c;  
}  
h3a{  
display:block;  
width:450px;height:60px;  
text-indent:480px;  
white-space:nowrap;  
background:url(logo.jpg)no-repeat00;