原文地址：CSS Hacks & Issues
翻译整理：西米CC
CSS Hack用于对不同浏览器区别处理，这样就做到了针对一些浏览器之间的显示问题进行单独的样式设计进行修复，关于如何使用hack，举一个非常简单的例子，例如CSS中的导入样式表语句@import，它是IE5之后才被IE所认同的一个命令，因此如果使用@import导入样式表，这些样式表只有IE5才能看到，IE4是没有办法解析的。
CSS Hack是在标准CSS没办法兼容各浏览器显示效果时才会用上的补救方法，在各浏览器解析CSS没有达成一致前，我们只能用这样的方法来完成任务，本文阐述了八条我们发现的在用CSS设计中有用的解决方案。
1.浏览器特定的选择器
当你想在一个浏览器里改变样式而不像在其他浏览器中改变时，这些选择器很有用：
a.IE6.0以下的浏览器版本
- *html{}
b.IE7.0以下的浏览器版本
- *:first-child+html {} * html {}
c.只针对IE7.0的Hack
- *:first-child+html {}
d.只对IE7.0和现代浏览器
- html>body {}
e.最新的Opera 9以下版本
- html:first-child {}
f.Safari浏览器
- html[xmlns*=”"] body:last-child {}
要使用这些他输的选择器，我们要在样式前写下这些代码，例如：
- #content-box {
- width: 300px;
- height: 150px;
- }
- * html #content-box {
- width: 250px;
- }
- /* 重写上面的代码并且把宽度改为250PX，在IE6以下版本中适用。 */
2.在IE6中使用透明PNG图片
IE6一个很难处理的BUG就是它不支持透明PNG图片，解决这个问题，我们要借助一个重写的CSS的滤镜：
- *html #image-style {
- background-image: none;
- filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="fil
- ename.png", sizingMethod="scale");
- }
3.去掉点击链接时出现的虚线框
当你点击链接时，Firefox会在链接周围产生一个虚线外框：
这个问题很好解决，只需在a标签中添加outline:none就可以了：
- a{
- outline:none;
- }
4.对inline元素应用宽度
如果对一个inline元素使用宽度，它将只在IE6下起作用，所有的HTML标签要么是Block的要么就是inline的，inline属性的标签有span和em，Block标签包括div、p、h1、form和li。我们不能控制inilne标签的宽度，不过有一个方法是把标签属性从inline改为Block：
- span{
- width:150px;
- display:block;
- }
应用display:block能够把span标签变成block类型，从而控制它的宽度。
