我希望在每行数据之后绘制一条水平线
<!DOCTYPE html>
<html>
<body>
<table>
<tr>
<td>
data a
</td>
</tr>
<hr/>
<tr>
<td>
data b
</td>
</tr>
</table>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
但我的代码输出是这样的
__________________________________________________________
data a
data b
Run Code Online (Sandbox Code Playgroud)
期待结果
data a
__________________________________________________________
data b
Run Code Online (Sandbox Code Playgroud)
另外的问题
如果让我说我有几个表行,但有些行不需要水平线我可以做类似的事情
.styletr {border-bottom: 1px solid black;}
Run Code Online (Sandbox Code Playgroud)
然后
<tr class=styletr>
</tr>
Run Code Online (Sandbox Code Playgroud)
?
最常用的方法是使用CSS来设置border元素的属性,如下所示:
tr {
border-bottom: 1px solid #000;
}
Run Code Online (Sandbox Code Playgroud)
对于您的代码,该hr元素使用起来没有意义.
我认为你不能在桌面内使用hr,你最好使用css:
<html>
<head>
<link href="YourCss.css" rel="stylesheet" type="text/css" />
</head>
<body>
...
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
在"YourCss.css"中:
tr { border-bottom: 1px solid black; }
Run Code Online (Sandbox Code Playgroud)
编辑:但是,这将在每个表格行的底部放置一个边框,包括最后一行,以排除您需要的最后一行
tr:not(:last-child) { border-bottom: 1px solid black; }
Run Code Online (Sandbox Code Playgroud)
编辑2:为了更好地控制哪些行的样式,你应该使用一个类:
<tr class="seperator">...</tr>
.seperator { border-bottom: 1px solid black; }
Run Code Online (Sandbox Code Playgroud)