css定义表格边框和表头

< html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>一个css类封装的细线表格边框</title>
<style type="text/css">
<!--
.mytable {
border-collapse : collapse;
}
.mytable td {
        background-color: #CCFFff;
        border: 1px solid #ff9900;
}
.mytable th
{background-color: #CCFFcc;
 border: 1px solid #ff9900;
}

.tdwidth{width:30px;}  --控制列的宽度,只需要写在一个td中就可以控制整个列的宽度
-->
</style>
</head>

<body>
<table width="300" border="0" cellpadding="0" cellspacing="0" class="mytable" >
<thead >
<tr>
 <th class="tdwidth">&nbsp;</th>
    <th>&nbsp;</th>
    <th>&nbsp;</th>
    <th>&nbsp;</th>
    <th>&nbsp;</th>
</tr>
</thead >
  <tr >
    <td >&nbsp;</td>
    <td>&nbsp;</td>
    <td class="tdwidth">只需要写在一个td中就可以控制整个列的宽度</td>
    <td >&nbsp;</td>
    <td >&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
</body>
< /html >

 

posted @ 2012-10-15 10:54  心语2012  阅读(309)  评论(0编辑  收藏  举报