您应该使用 CSS 进行演示/样式设置:
tbody {
border: 1px solid #ccc;
}
JS 小提琴演示.
我不确定你有多新,但为了完整起见:
<head>
<!-- other stuff -->
<style type="text/css">
tbody {
border: 1px solid #ccc;
}
</style>
<!-- other stuff -->
</head>
您还可以在元素的开始标记中使用内联样式,例如:
<tbody style="border: 1px solid #ccc;">
不过,最好链接到外部样式表,这会进入head
文件的内容:
<link href="path/to/stylesheet.css" rel="stylesheet" type="text/css" />
或者,如果您的目标浏览器不提供样式设置选项tbody
with a border
,您可以针对特定细胞内tbody
使用以下内容:
table {
margin: 0;
border-spacing: 0;
}
tbody tr td:first-child {
border-left: 2px solid #000;
}
tbody tr td:last-child {
border-right: 2px solid #000;
}
tbody tr:first-child td {
border-top: 2px solid #000;
}
tbody tr:last-child td {
border-bottom: 2px solid #000;
}
JS 小提琴演示.
当然,这确实需要浏览器能够理解并实现:last-child
and :first-child
伪类。