css学习4---css控制表格
html如下;
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> tableTest </TITLE>
<style>
.dataList{
border:1px solid #0058a3;
font-family:Arial;
border-collapse:collapse;
background-color:#eaf5ff;
font-size:14px;
}
.dataList caption{
padding-bottom:5px;
font:bold 1.4em;
text-align:left;
}
.dataList th{
border:1px solid #0058a3;
background-color:#4bacff;
color:#ffffff;
font-weight:bold;
padding-top:4px;
padding-bottom:4px;
padding-right:12px;
padding-left:12px;
}
.dataList td{
border:1px solid #0058a3;
text-align:left;
padding-top:4px;
padding-bottom:4px;
padding-right:10px;
padding-left:10px;
}
</style>
<script >
</script>
</HEAD>
<BODY>
<table id="table" class="dataList" >
<caption>表格测试</caption>
<tr><th>姓名</th><th>年龄</th><th>手机</th><th>地址</th></tr>
<tr><td>张三</td><td>22</td><td>22</td><td>杭州市西湖区</td></tr>
<tr><td>李四</td><td>33</td><td>33</td><td>33</td></tr>
<tr><td>王五</td><td>44</td><td>44</td><td>44</td></tr>
</table>
</BODY>
</HTML>
最后的控制效果如下：
不同浏览器的区别：
ff/IE8/IE7/IE6
.a {color:#f00; color:#f60\9; +color:#00FF00; _color:#0000FF; }
