<table>设置每一行的边框和间隔
时间: 2023-12-06 10:45:10 浏览: 35
你可以使用CSS来为表格设置行边框和间隔,具体方法如下:
```css
table {
border-collapse: collapse; /* 合并边框 */
border-spacing: 0; /* 单元格间距 */
}
/* 设置行边框 */
td, th {
border: 1px solid black; /* 边框样式 */
}
/* 设置偶数行背景颜色 */
tr:nth-child(even) {
background-color: #f2f2f2;
}
```
这个CSS样式规则将会把表格的边框合并为一个,并且将单元格之间的间距设置为0。然后,每个单元格都会有一个1像素的黑色边框。最后,偶数行的背景颜色会被设置为浅灰色。
你可以根据自己的需要修改这些样式规则,来达到自定义表格的目的。
相关问题
<table>设置每一行的边框为蓝色,间隔为10px
你可以使用以下CSS样式来实现:
```css
table {
border-collapse: separate;
border-spacing: 10px;
}
table tr {
border: 1px solid blue;
}
```
其中,`border-collapse: separate`指定了单元格边框的合并方式为分隔,`border-spacing: 10px`指定了单元格之间的间隔为10像素。`table tr`选择器指定了每一行的样式,`border: 1px solid blue`指定了边框宽度为1像素,样式为实线,颜色为蓝色。
<table>设置行边框,行间距
可以使用CSS来设置表格的行边框和行间距,以下是示例代码:
```html
<table>
<tr style="border: 1px solid black;">
<td>Row 1, Column 1</td>
<td>Row 1, Column 2</td>
</tr>
<tr style="border: 1px solid black;">
<td>Row 2, Column 1</td>
<td>Row 2, Column 2</td>
</tr>
</table>
```
在上述代码中,`<tr>`标签被设置了一个1像素宽的黑色边框。如果要设置行间距,可以在`<table>`标签中使用`cellspacing`属性,例如:
```html
<table cellspacing="10">
<tr style="border: 1px solid black;">
<td>Row 1, Column 1</td>
<td>Row 1, Column 2</td>
</tr>
<tr style="border: 1px solid black;">
<td>Row 2, Column 1</td>
<td>Row 2, Column 2</td>
</tr>
</table>
```
在上述代码中,`cellspacing`属性被设置为10像素,这将在每个单元格周围创建10像素的间隔。