web设计中浏览器不兼容的设置

全局CSS设置

1.清除所有的标记的内外边距

    body,ul,li,a,img,p,input{margin:0;padding:0;}

2.去除项目符号或编号前面的符号

    ul,ol,li{list-style:none;}

3.全局链接效果

    a:link,a:visited{color:#444,text-decoration:none;}

    a:hover{color:red;}

4.网页中所有的文字大小颜色

    body{font-size:12px;font-family:宋体;color:#ccc;}

5.去除图片的链接边框线

    img{border:0;}

6.全局的类样式

    .floatL{float:left;}

    .floatR{float:right;}

    .clear{clear:both;}<!--清除浮动-->

    .blank10{height:10px;clear:both;}<!--清除浮动,中间加10培训的距离-->

    .red{color:red;}

    .blue{color:blue}

常用的兼容性调试技巧

1.实现所有的浏览器主页居中

    火狐下的主页居中: .box{margin:0px auto;}

    IE5.5下的主页居中: body{text-align:center;}

    结合在一起: .box{text-align:center;}

2.单行文本上下居中

    h1{height:30px;line-height:30px;}

3.在IE6下,左右margin加倍,IE6,5下的一个bug

    解决方法: .class{display:inline;}//将块元素转为行内元素

    注意:排版时,能使用padding解决的,坚决不用margin.如果实在想用,就只是用一边.

CSS HACK

1.针对不同的浏览器,书写不同的CSS代码的过程,成为"CSS HACK"

    也就是说:写一个CSS代码,让IE6识别,其他的浏览器不识别

2.下面,针对不同的浏览器,有几个符号:

    这些符号是在CSS属性的前面加的,用于分辨不同的浏览器版本

    "*"IE6和IE7都识别,如: .box{*backgroung-color:red;}

    "_"IE6识别,如: .box{_backgroung-color:red;}

编写顺序:Firefox---IE7---IE6

3.他不是W3C的标准,尽量少用