表格和伪选择器的综合应用以及一些细节问题

来源:互联网 发布:unity3d ui制作 编辑:程序博客网 时间:2024/06/09 19:15

代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>表格和伪选择器的综合应用</title><style type="text/css" >    table{        background-color:#CCC;          /*灰色 */        border-collapse:collapse;       /*合并边框*/        border:3px;    }    tr:hover{        background-color:#0F0;    }</style></head><body>    <table border="1px" width="400px" height="300px" align="center" >            <caption>部门汇总表</caption>            <tr>                <th>部门编号</th>       <!--表头 -->                <th>部门名</th>                <th>人数</th>            </tr>            <tr>                <td>002</td>                <td>开发部</td>                <td>100</td>            </tr>            <tr>                <td>005</td>                <td>人事部</td>                <td>30</td>            </tr>            <tr>                <td rowspan="2">007</td>                <td>后勤部1</td>                <td>20</td>            </tr>            <tr>                <td>后勤部2</td>                <td>70</td>            </tr>    </table></body></html>

效果:

0 0
原创粉丝点击