方法几乎能解决现今所有HACK.
1,!important
支持,!important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.)
#wrapper
{
width: 100px!important; /* IE7+FF */
width: 80px; /* IE6 */
}
2,IE6/IE7 对 Firefox
标签,firefox 暂不支持.而*+html 又为 IE7特有标签.
#wrapper
{
#wrapper { width: 120px; } /* FireFox */
*html #wrapper { width: 80px;} /* ie6 fixed */
*+html #wrapper { width: 60px;} /* ie7 fixed,注意顺序 */
}
代码加入Global CSS 中,给需要闭合的div加上 class=”clearfix” 即可,屡试不爽.
/* Clear Fix */.clearfix:after
{
content:”.”;
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearfix
{
display:inline-block;
}
/ Hide from IE Mac /
.clearfix {display:block;}
/ End hide from IE Mac /
/ end of clearfix /
增加,但IE不会.(可用!important解决)2,居中问题.1).垂直居中.将 line-height 设置为 当前 div 相同的高度,再通过 vertical-align: middle.( 注意内容不要换行.)2).水平居中. margin: 0 auto;(当然不是万能)3,若需给 a 标签内内容加上 样式,需要设置 display: block;(常见于导航标签)4,FF 和 IE 对 Box 理解的差异导致相差 2px 的还有设为 float的div在ie下 margin加倍等问题.5,ul 标签在 FF 下面默认有 list-style 和 padding . 最好事先声明,以避免不必要的麻烦. (常见于导航标签和内容列表)6,作为外部 wrapper 的 div 不要定死高度,最好还加上 overflow: hidden.以达到高度自适应.7,关于手形光标. cursor: pointer. 而hand 只适用于 IE.
1 针对firefox ie6 ie7的css样式
显示，但是ie7对!important可以正确解释，会导致页面没按要求显示！找到一个针对IE7不错的hack方式就是使用“*+html”，现在用IE7浏览一下，应该没有问题了。现在写一个CSS可以这样：
显示为#333，IE6下字体颜色显示为#666，IE7下字体颜色显示为#999。
2 css布局中的居中问题
内容居中；对于IE这样设定就已经可以了。但在mozilla中不能居中。解决办法就是在子元素定义时候设定时再加上“MARGIN-RIGHT: auto;MARGIN-LEFT: auto; ” 需要说明的是，如果你想用这个方法使整个页面要居中，建议不要套在一个DIV里，你可以依次拆出多个div，只要在每个拆出的div里定义MARGIN-RIGHT: auto;MARGIN-LEFT: auto; 就可以了。
3 盒模型不同解释
<pre class="code"><font size="4">#Box{ width:600px; //for ie6.0- w\idth:500px; //for ff+ie6.0}
Box{ width:600px!important //for ff width:600px; //for ff+ie6.0 width /**/:500px; //for ie6.0-}
4 浮动ie产生的双倍距离
body #Box{ width: auto; height: auto; min-width: 80px; min-height: 35px;}
6 页面的最小宽度
7 清除浮动
Box{ display:table; //将对象作为块元素级的表格显示}或者.hackBox{ clear:both;} 或者加入:after（伪对象）,设置在对象后发生的内容，通常和content配合使用，IE不支持此伪对象，非Ie 浏览器支持，所 以并不影响到IE/WIN浏览器。这种的最麻烦的……#Box:after{ content: “.”; display: block; height: 0; clear: both; visibility: hidden;}
8 DIV浮动IE文本产生3象素的bug
Box{ float:left; width:800px;}#left{ float:left; width:50%;}#right{ width:50%;}*html #left{ margin-right:-3px; //这句是关键}HTML代码
9 属性选择器(这个不能算是兼容,是隐藏css的一个bug)
属性选择器和子选择器还是有区别的,子选择器的范围从形式来说缩小了,属性选择器的范围比较大,如p[id]中,所有p标签中有id的都是同样式的.
10 IE捉迷藏的问题
链接，DIV等这个时候容易发生捉迷藏的问题。有些内容显示不出来，当鼠标选择这个区域是发现内容确实在页面。解决办法：对#layout使用line-height属性 或者给#layout使用固定高和宽。页面结构尽量简单。
11 高度不适应
自动进行调节，特别是当内层对象使用 margin 或paddign 时。例： p对象中的内容
