欢迎您访问 最编程 本站为您分享编程语言代码,编程技术文章!
您现在的位置是: 首页

如何用CSS调整表格边框之间的间距

最编程 2024-08-08 07:34:08
...

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>border-spacing属性</title>

<style>

            table, th, td {

            border: 2px solid #3E8F3E;

            text-align: center;

        }


        #demo {

            border-collapse: separate;

            background-color: none;

            border-spacing: 20px 40px;

        }


        h2 {

            color: green;

        }

        </style>

    </head>

    <body>

    <center>

        <h2>border-spacing属性</h2>

        <h3>border-spacing: 20px 40px;</h3>

        <table style="width:70%" id="demo">

            <tr>

                <th>姓名</th>

                <th>年龄</th>

                <th>性别</th>

            </tr>

            <tr>

                <td>晓华</td>

                <td>15</td>

                <td>女</td>

            </tr>

            <tr>

                <td>天健</td>

                <td>27</td>

                <td>男</td>

            </tr>

            <tr>

                <td>邓琴</td>

                <td>28</td>

                <td>女</td>

            </tr>

        </table>

    </center>

</body>


</html>