CSS 基础教程-047 CSS设置表格边框

由 hrs, 4 二月, 2020

我们在html中创建了一个表格，我该如何来给它添加边框呢？这个实例 我们就来讲解表格的边框。

实例代码：

<!doctype html>
<html>
<head>
<meta charset="utf-8">

<style type="text/css"> 
table,th,td{border: 1px solid black;}
th,td{
    padding:5px; /*设置内边距为5px*/
    width:80px;  /*设置th，td 宽度为80px */
    text-align:center; /*设置th，td 表格对齐方式为居中*/

    }   
</style>
</head>
<body>
    <h1>表格边框实例</h1>
    <table>
        <tr>
        <th>姓名</th>
        <th>年龄</th>
    </tr>
    <tr>
        <td>张三</td>
        <td>李四</td>
    </tr>
        <tr>
        <td>28</td>
        <td>32</td>
    
    </tr>


    </table>

</body>

</html>
~

运行效果：

css_047.png

标签

评论