CSS控制表格tr之间的边距

tr之间距离可以通过设置 tr 的外边距(margin)来实现,但是注意必须先把tr的显示属性设置为块体(block)元素:

tr{
    display:block;
    margin:2px 0;
}


创建HTML元素示例如下:

<table>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
    </tr>

    <tr>
        <td>4</td>
        <td>5</td>
        <td>6</td>
    </tr>

    <tr>
        <td>7</td>
        <td>8</td>
        <td>9</td>
    </tr>
</table>


添加CSS样式

table{
    border-collapse: collapse;
}

td{
    width:90px;
    padding:5px;
    border:1px solid green;
}

tr{
    display:block; /*将tr设置为块体元素*/
    margin:2px 0;  /*设置tr间距为2px*/
}

显示效果

文章转载于:learneroner  链接:https://zhidao.baidu.com/question/86746837.html

猜你喜欢

转载自blog.csdn.net/Rao_Limon/article/details/81843317
今日推荐