一.不同浏览器的标签默认的外补丁和内补丁不同
随便写几个标签，不加样式控制的情况下，各自的margin 和padding差异较大。
方法:
*{margin:0;padding:0;}
二.图片默认有间距
几个img标签放在一起的时候，有些浏览器会有默认的间距,加了通配符也不起作用
**方法: 使用float属性为img布局 **
因为img标签是行内属性标签，所以只要不超出容器宽度，img标签都会排在一行里，但是部分浏览器的img标签之间会有个间距。去掉这个间距使用float是正道。
三. 透明度兼容所有浏览器
方法:
..transparent_class {
filter : alpha(opacity = 50);
-moz-opacity: 0.5;
-khtml-opacity : 0.5;
opacity : 0.5;
}
四. 技巧
1.让用 IE 访问页面时，尽可能用最新的 IE 渲染引擎。
方法:
//通过加在 HTML 中加此标签
<meta http-equiv="X-UA-Compatible" content="IE=edge">
2.让双核浏览器（如 360，搜狗等国产浏览器）访问本网页时，用 webkit 内核来渲染。
//通过加在 HTML 中加此标签
<meta name="renderer" content="webkit">
3.避免使用有问题的 DocType 而导致的浏览器用怪癖模式来渲染页面。
//用 HTML5 的 DocType
<!DOCTYPE html PUBLIC>
五. 浮动元素无法撑起父元素
定义div元素浮动之后，无法撑开父级元素，当定义父级宽度足够时里面的元素才能够浮动显示
方法: 清除浮动
.clearfix:after{
content : ".";
display : block;
height : 0;
visibility : hidden;
clear : both;
}
.clearfix { *zoom : 1}
网友评论