关于浏览器兼容的问题！
1、网页居中显示：
需要设置两个地方，一个是body，一个是外边框div。
body{
margin:0;
padding:0;
text-align:center;
}
/*最外层DIV*/
#main{
width:760px;
margin:0 auto;
padding:0;
}
2、文字垂直居中显示：
在DIV中定义一个行高与其高度相同即可。
.title{
height:25px;
line-height:25px;
vertical-align:middle;
}
3、图片垂直居中显示：
在<img>标签中加入align="absmiddle" 即可。
4、清除浮动：
如果在同一行上有几个DIV并列显示，那么必须在其中加入清除浮动代码。
CSS
.clear{clear: both;}
HTML
<div id="main">
<div class="left"></div>
<div class="center"></div>
<div class="right"></div>
<div class="clear"></div>
</div>
5、三列结构中的的DIV写法：
适用于左右栏是窄幅，中栏为主要内容显示，让其宽度自适应。
CSS
#main{
width:760px;
margin:0 auto;
}
.left{
width:100px;
float:left;
}
.right{
width:120px;
float:right;
}
.center{
margin:0 120px 0 100px;
width:auto;
}
.clear{clear: both;}
HTML
<!--注意：center这个DIV的位置-->
<div id="main">
<div class="left"></div>
<div class="right"></div>
<div class="center"></div>
<div class="clear"></div>
</div>
6、textarea在FireFox中不能自动换行的处理：
有时我们可能会遇到这种现象，在IE中可以自动换行，但在FF中就是不行，即使加了word-break:break-all;word-warp:warp;也没有效果，怎么回事呢？主要原因是因为我们加入到textarea中的英文字符或代码过长，造成它误识别为一个单词所致。解决方法也很简单，就是在内容中，人为加一些空格，让FF自动识别为多个单词，从而就能正确换行了。
7、设置<ul>表列缩进值：
默认情况下，<ul>列表是缩进两个字符显示列表项目的，我们可以通过设置负边界值达到控制其缩进值的目的。
默认值是0，负值表示向左移，正值表示向右移。
ul{ margin-left: -24px; }
8、水平导航条的制作示例：
HTML
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">News</a></li>
<li><a href="#">Products</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Clients</a></li>
<li><a href="#">Case Studies</a></li> </ul>
CSS中，首先清除ul的list-style、margin和padding：
ul {
margin: 0;
padding: 0;
list-style: none;
width: 720px;
float: left;
background: #FAA819 url(images/mainNavBg.gif) repeat-x;
}
然后，可以将li的display属性设置了inline或者设置float为left，display li可能会出现bug，所以我一般用float left的方法：
ul li {
float: left;
}
ul a {
display: block;
float: left; /*跨浏览设置*/
padding: 0 2em;
line-height: 2.1em;
background: url(images/divider.gif) repeat-y left top;/*设置分隔线*/
text-decoration: none;
color: #fff;
}
ul .first a {
background: none; /*去掉第一个链接的背景*/
}
ul a:hover {
color: #333;
}
以上在IE/FF中顺利通过。
