解决这个BUG的技巧有很多,可以是改变html的排版,或者设置img为display:block或者设置vertical-align属性为vertical-align:top/bottom/middle/text-bottom 都可以解决.
18.对齐文本与文本输入框
加上vertical-align:middle;
<style type=”text/css”> <!– input { width:200px; height:30px; border:1px solid red; vertical-align:middle; } –> </style>
经验证，在IE下任一版本都不适用，而ff、opera、safari、chrome均OK！
19.LI中内容超过长度后以省略号显示
此技巧适用与IE、Opera、safari、chrom浏览器，FF暂不支持。
<style type=”text/css”> <!– li { width:200px; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow: hidden; } –> </style>
20.为什么web标准中IE无法设置滚动条颜色了
解决办法是将body换成html
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “”> <meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ /> <style type=”text/css”> <!– html { scrollbar-face-color:#f6f6f6; scrollbar-highlight-color:#fff; scrollbar-shadow-color:#eeeeee; scrollbar-3dlight-color:#eeeeee; scrollbar-arrow-color:#000; scrollbar-track-color:#fff; scrollbar-darkshadow-color:#fff; } –> ＜/style>
21.为什么无法定义1px左右高度的容器
IE6下这个问题是因为默认的行高造成的,解决的技巧也有很多：
例如:overflow:hidden zoom:0.08 line-height:1px
22.怎么样才能让层显示在FLASH之上呢
解决的办法是给FLASH设置透明
<param name=”wmode” value=”transparent” />
23.链接(a标签)的边框与背景
a链接加边框和背景色，需设置 display: block, 同时设置 float: left 保证不换行。参照menubar, 给 a 和menubar设置高度是为了避免底边显示错位, 若不设 height, 可以在menubar中插入一个空格。
24.超链接访问过后hover样式就不出现的问题
被点击访问过的超链接样式不在具有hover和active了,很多人应该都遇到过这个问题,解决技巧是改变CSS属性的排列顺序: L-V-H-A
<style type=”text/css”> <!– a:link {} a:visited {} a:hover {} a:active {} –> </style>
25.FORM标签
这个标签在IE中,将会自动margin一些边距,而在FF中margin则是0,因此,如果想显示一致,所以最好在css中指定margin和 padding,针对上面两个问题,我的css中一般首先都使用这样的样式ul,form{margin:0;padding:0;}。
26.属性选择器(这个不能算是兼容,是隐藏css的一个bug)
p[id]{}div[id]{}
这个对于IE6.0和IE6.0以下的版本都隐藏,FF和OPera作用.属性选择器和子选择器还是有区别的,子选择器的范围从形式来说缩小了,属性选择器的范围比较大,如p[id]中,所有p标签中有id的都是同样式的.
27.为什么FF下文本无法撑开容器的高度
标准浏览器中固定高度值的容器是不会象IE6里那样被撑开的,那我又想固定高度,又想能被撑开需要怎样设置呢？办法就是去掉height设置min-height:200px; 这里为了照顾不认识min-height的IE6 可以这样定义:
{ height:auto!important; height:200px; min-height:200px; }