表格边框

最新推荐文章于 2022-06-27 11:20:19 发布

anchaqian9321

最新推荐文章于 2022-06-27 11:20:19 发布

阅读量121

点赞数

原文链接：http://www.cnblogs.com/hyx626/p/11099170.html

版权


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<style>
    a{}
    table{margin: 0px auto;border-collapse: collapse}
    table{border: 3px solid green;}
    table td,table th{border: 1px solid red}
     border="1" style="margin: 0px auto;border-collapse: collapse"
</style>
<style type="text/css">
    .newsDetails_content table{margin: 0px auto;border-collapse: collapse;}
    .newsDetails_content table td,table th{border: 1px solid #666;}
</style>
<body>
    <table   >
        <tr>
            <th>我是标题</th>
            <th>我是标题</th>
            <th>我是标题</th>
            <th>我是标题</th>
        </tr>
        <tr>
            <td>我是第一行</td>
            <td>我是第一行</td>
            <td>我是第一行</td>
            <td>我是第一行</td>
        </tr>
        <tr>
            <td>我是第二行</td>
            <td>我是第二行</td>
            <td>我是第二行</td>
            <td>我是第二行</td>
        </tr>
        <tr>
            <td>我是第三行</td>
            <td>我是第三行</td>
            <td>我是第三行</td>
            <td>我是第三行</td>
        </tr>
        <tr>
            <td>我是第四行</td>
            <td>我是第四行</td>
            <td>我是第四行</td>
            <td>我是第四行</td>
        </tr>
    </table>
</body>
</html>
<!--
我们可以把table看成一个大的方框，然后把td看成一个小的方框。tr是一条水平线，限制着小方框td放在那条水平线上。

 cellpadding是文字离td方框线的距离(td内边距);
 cellspacing一个方框与另一个方框的距离。(td外边距);
 -->

 <!-- 
border:1px写在table属性的时候table，td 都会有边框线。
border: 1px solid red写在table样式的时候只有table有边框线。

border:1px;写成table的属性,因为这种写法会导致写样式(css)很难控制border-color以及有些浏览顺不兼容。
写边框最好是这样写table td,table th{border: 1px solid red}

border-collapse: collapse可以使上下td的边框成一条线。

  -->

转载于:https://www.cnblogs.com/hyx626/p/11099170.html