1.<div class="content float1"></div>以上这种写法：同一个HTML元素可以添加多个类名称，多个类名称之间用空格隔开。

2.浏览器兼容性简介


因为CSS代码是由浏览器软件来进行解释的，每个浏览器厂商到CSS标准执行的不是太完善。


同一个网页，在不同浏览器下显示的效果不一样，这种现象就是“不兼容”。


最不兼容的浏览器是：IE6、IE7、IE8

3.浏览器市场份额统计

4.IE低版本浏览器兼容性测试软件：IETester

5.全局CSS设置(页面常用的元素和类直接用全局CSS进行设置，统一格式，防止不兼容)

（1）清除所有HTML元素的内外边距
html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5,h6, form, fieldset, legend, img { margin:0; padding:0; }
（2）项目符号和编号
ul,ol,li{list-style:none;}
（3）图片要去除边框线
img{border:none;}
（4）标题标记的设置
       h2{font-size:24px;padding:8px 0px;}
       h4{font-size:16px;padding:5px 0px;}
（5）全局链接的设置
       a:link,a:visited{color:#0000ff;text-decoration:none;}
       a:hover{color:#ff0000;text-decoration:underline;}
（6）常用全局的类样式
       .clear{clear:both;}
       .float1{float:left;}
       .float2{float:right;}
       .blank10{height:10px;clear:both;}
       .red{color:#FF0000;}
       .blue{color:#0000FF;}
       #noLine{border:none;}

6.常用兼容性技巧

（1）网站主页绝对居中：不管在任何浏览器中，都能实现主页居中。

margin:0pxauto;
 text-align:center
 
body{
       font-size:12px;
       color:#444;

       text-align:center;/*IE中居中写法，这个写法虽然解决了在IE5中主页居中的问题，但是页面内所有的文字都会居中，那么需要主页的内容用一个div（类名为box）套起来，然后让box中的文字变回原来的左对齐*/

background:#ccc url(../images/bg-body.gif) repeat-x;
}
.box{
width:980px;
margin:0px auto;
text-align:left;
}

（2）单行文本上下中齐

h2{
              height:45px;
              line-height:45px;
}

（3）实现1px高的<div>的容器

.box{
       height:1px;
       overflow:hidden; /*在IE6下，IE6默认div至少是一个汉字的高，无法做到1px，增加多这个设置，就可以做到，使超出的部分隐藏起来*/
       background-color:#FF0000;
}

（4）光标类型

.box{
              cursor:pointer;   /*手形*/  光标类型还有： help、wait、text等
}

（5）上下外边距合并（尽量少用margin）

所有浏览器都是)。

       我们解决的办法是：

       (1)只指定其中一个元素的下外边距或上外边距。

.div1{
       width:300px;
       height:100px;
       background-color:#FF0000;
       margin:20px 20px 70px;
}
.div2{
       width:300px;
       height:100px;
       background-color:#0000FF;
       margin:0px 50px 50px;
}

       (2)两个元素的中间外边距都取消，使用一个空的<div>，并指定一个高度，放在两个元素的中间。

<div class="div1"></div>

<divstyle="height:70px;"></div>

<div class="div2"></div>

（6）左右外边距加倍(IE6下的一个现象，浮动后，设置margin，左边距加倍)

.box{
       width:400px;
       height:100px;
       margin:50px;
       float:left;
       display:inline; /*将块元素转成行内元素*/
       background-color:#FF0000;
}

也可以使用hack技巧，在margin下写_margin:50px，这种写法只有IE6支持，会覆盖上面的margin设置。


7.CSS HACK

针对不同浏览器编写CSS代码的过程，称为CSS HACK。如：写一段只有IE6浏览器支持的CSS代码。

body{
       background-color:#FF0000;  /*所有浏览器都支持*/ 范围大的放在最上边
       *background-color:#00FF00; /*IE6和IE7支持*/
       _background-color:#0000FF; /*只有IE6支持*/支持范围最小的放在最小边
}

注意：

       CSS HACK虽然能解决部分CSS兼容性的问题，但必竟不是W3C推荐的规范标准，因此尽量少用。

       平常我们写CSS代码，多用标准CSS写法，实在不行，偶尔用一下CSS HACK。