在HTML中，我们可以使用<table>、<tr>、<td>等标签来创建表格，HTML本身并不支持直接设定表格单边边框，如果你想要设置单边边框，你需要使用CSS来实现。
（图片来源网络，侵删）
以下是一个简单的例子，我们将创建一个带有单边边框的表格：
<!DOCTYPE html>
<html>
<head>
<style>
table {
bordercollapse: collapse;
width: 100%;
}
th, td {
textalign: left;
padding: 8px;
}
tr:nthchild(even){backgroundcolor: #f2f2f2}
th {
backgroundcolor: #4CAF50;
color: white;
}
tr:nthchild(odd) {
borderleft: 2px solid black; /* 这里设置单边边框 */
}
</style>
</head>
<body>
<h2>带单边边框的表格</h2>
<table>
<tr>
<th>姓名</th>
<th>邮箱</th>
<th>城市</th>
</tr>
<tr>
<td>张三</td>
<td>zhangsan@example.com</td>
<td>北京</td>
</tr>
<tr>
<td>李四</td>
<td>lisi@example.com</td>
<td>上海</td>
</tr>
</table>
</body>
</html>
在这个例子中，我们首先定义了一个table，然后定义了th和td的样式，包括文本对齐方式和内边距，我们使用CSS的伪类选择器:nthchild(odd)来选择所有奇数行的表格行，并给它们添加一个左边框，这样，我们就得到了一个带有单边边框的表格。
这个例子中，我们使用了CSS的伪类选择器:nthchild(odd)来选择所有奇数行的表格行，并给它们添加一个左边框，你可以根据需要修改这个选择器来改变边框的位置，如果你想要在偶数行添加边框，你可以将选择器改为:nthchild(even)。
你还可以使用其他的CSS属性来自定义边框的样式，例如颜色、宽度、样式等，你可以将上述代码中的borderleft: 2px solid black;改为borderleft: 2px dashed red;来改变边框的颜色和样式。
通过使用CSS，我们可以很容易地在HTML表格中添加单边边框，或者根据需要自定义边框的样式和位置。
原创文章，作者：未希，如若转载，请注明出处：https://www.kdun.com/ask/430155.html
微信扫一扫