DIV+CSS浏览器兼容性分析
!important是CSS1定义的语法，作用是提高指定样式规则的应用优先权。目前IE一不支持这个语法，而其他的浏览器则都支持。可以利用这一点来定义不同浏览器间的CSS样式。
如下样式：
.sidebar{ border:5px dotted #FC5 !important ; border:5px dotted #00F; padding-top:20px; margin:0 auto;}
IE中浏览时候由于它不能够解释!important语法，因此边框显示的颜色为#FC5；能完全解释出!important语法的浏览器则把.sidebar边框的着色显示为#00F。
2、访问过后超链接a:hoverr的样式不显示
改变CSS属性的排列顺序，先后顺序标准应为：
a:link -> a:visited -> a:hover -> a:active
3、Li中内容超过长度后以省略号显示的方法
li { width:250px; white-space:nowrap; text-overflow:ellipsis; overflow: hidden;}
<ul>
<li>Li中内容超过长度后以省略号显示的方法</li>
<li>Li中内容超过长度后以省略号显示的方法</li>
</ul>
4、定义margin和padding尺寸的缩写（TRBL）
margin:3px; 表示所有边都是3px；
margin:3px 5px; 表示top和bottom的值是3px ,right和left的值是5px
margin:3px 5px 7px; 表示top的值是3，right和left的值是5，bottom的值是7
margin:3px 5px 7px 5px; 四个值依次表示top,right,bottom,left上右下左。
5、IE不能正确显示透明PNG图片
header内加入：
<script language="javascript">
function correctPNG(){
for(var i=0; i<document.images.length; i++){
var img = document.images[i]
var imgName = img.src.toUpperCase()
if (imgName.substring(imgName.length-3, imgName.length) == "PNG"){
var imgID = (img.id) ? "id='" + img.id + "' " : ""
var imgClass = (img.className) ? "class='" + img.className + "' " : ""
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
var imgStyle = "display:inline-block;" + img.style.cssText
if (img.align == "left") imgStyle = "float:left;" + imgStyle
if (img.align == "right") imgStyle = "float:right;" + imgStyle
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
var strNewHTML = "<span " + imgID + imgClass + imgTitle + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";" + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader" + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"
img.outerHTML = strNewHTML
i = i-1
}
}
}
window.attachEvent("onload", correctPNG);
</script>
6、ul在Firefox和IE下表现不同
ul在Firefox下有padding值，没有margin值。IE下则相反，ul有margin值，没有padding值
在Firefox下，ul的list-style默认是处于内容的外边缘的。
构建网站时CSS样式可写为：
padding:0; margin:0; list-style:inside;
或
padding:0; margin:0; list-style:none;
7、BOX模型在firefox和IE中的解释相差2px的解决方法
div{margin:30px !important ; margin:28px;}
仍是利用IE不支持 !important 这个语法而来写CSS样式。注意margin的顺序，IE并不支持!important，故在IE下解释后的样式是div{maring:30px;margin:28px}，当有重复定义值时按照最近优先的原则来取值。
8、margin的默认效果
div中的内容，ie默认为居中，而ff默认为左对齐。使内容居中的方法是将CSS样式定义为：div{margin:auto;}