css+div常见问题整理

1.兼容IE与FF如何使连续英文长字段自动换行
css使用word-wrap: break-word,如果是table中，定义如下：
table { table-layout:fixed;  }
table tr td,table tr th{ overflow:hidden; word-wrap: break-word; }

2.ff下为什么父容器的高度不能自适应
解决的办法是在div 与 p 之间插入<div style="clear:both"></div>清除掉这个p的浮动
或父元素使用overflow:hidden这个属性。

3.伪类声明顺序
a:link { color:red }
a:hover { color:blue }
a:visited { color:green }
a:active { color:orange }

4.IE6的双倍边距BUG
浮动元素margin在IE6中解释为双倍，使用 display : inline 。

5. position:fixed不能兼容IE6
6.IE6的外边距3PX BUG，可使用heck解决
7. list-style-image无法准确定位的问题

8.通用垂直居中文本方法
div{ line-height:30px; height:30px }

9.一个div元素垂直居中浏览器样式
div {
    position:absolute;
    top:50%;
    left:50%;
    margin:-100px 0 0 -100px;
    width:200px;
    height:200px;
    border:1px solid red;
    }
10.让div透明解决方法
    opacity:30;

    filter:alpha(opacity=30)

11.table tr 边框 IE不显示解决方法

     使用background属性替代border

12.CSS3背景渐变兼容各浏览器代码

background-image:-webkit-gradient(linear, left top, left bottom, from(#dedede), to(#f5f5f5)); /* Saf4+, Chrome */
background-image:-webkit-linear-gradient(top, #dedede 35%, #f5f5f5 140%); /* Chrome 10+, Saf5.1+ */
background-image:-moz-linear-gradient(top, #dedede 35%, #f5f5f5 140%); /* FF3.6 */
background-image:-ms-linear-gradient(top, #dedede 35%, #f5f5f5 140%); /* IE10 */
background-image:-o-linear-gradient(top, #dedede 35%, #f5f5f5 140%); /* Opera 11.10+ */
background-image:linear-gradient(top, #dedede, #f5f5f5);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#dedede', EndColorStr='#f5f5f5'); /* IE6–IE9 */