搜索

表格制作测试作业

原创 2019-04-13 21:08:01 301
摘要:<!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <title>表格测试作业</title&
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格测试作业</title>
    <style type="text/css">
        * {
            padding: 0;
            margin: 0;
        }
        table {
            border: 1px solid #ccc;
            border-collapse: collapse;
            width: 500px;
        }
        tr th {
            border: 1px solid #ccc;
            height: 50px;
        }
        tr td {
            height: 50px;
            border: 1px solid #ccc;
        }


    </style>
</head>
<body>
<table>
    <tr>
        <th>1</th>
        <th>2</th>
        <th>3</th>
        <th>4</th>
    </tr>
    <tr>
        <td colspan="4">这是合并列1</td>
    </tr>
    <tr>
        <td rowspan="2">这是合并行 1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
    </tr>
    <tr>
        <td>2</td>
        <td>3</td>
        <td>4</td>
    </tr>




</table>
</body>
</html>


批改老师:天蓬老师批改时间:2019-04-13 21:52:06
老师总结:有二点建议: 1. <style>中尽可能不要用*, 直接用标签名, 进行样式重置 2. <table>中推荐添加<tbody>, 否则有可能用js获取单元格数据时出错, 就算你不加, 浏览也会自己加, 不如你主动点

发布手记

热门词条