html设置分隔行,html – 如何:“用行分隔表行”

本文介绍了如何使用CSS来实现HTML表格的边框样式,包括去除单元格间距,设置行边框,以及通过CSS选择器如`:first-child`和`:last-child`来控制特定边框的显示。同时,提到了CSS的`border-collapse`属性在创建连续边框中的作用,以及如何通过填充避免间距问题。
摘要由CSDN通过智能技术生成

有几种方法可以做到这一点。单独使用HTML,你可以写

或者,如果您想要在第一行上方和最后一行下方的边​​框,

这是相当僵化的;你不能使线条以这种方式点缀,或者比一个像素更粗。这就是为什么在过去人们使用特殊的分隔符行,只包含一些旨在产生行的内容(它变得有点脏,特别是当你需要制作行,例如只有几个像素高,但这是可能的)。

对于大多数情况,现在人们为此而使用CSS边框属性。这是相当简单和跨浏览器。但请注意,为了使线条连续,您需要防止单元格之间的间距,使用表标记中的cellspacing = 0属性或CSS规则表{border-collapse:collapse; }。删除这样的间距可能需要在单元格内添加一些填充(最好使用CSS)。

最简单,你可以使用

table {

border-collapse: collapse;

}

tr {

border: solid;

border-width: 1px 0;

}

这将边界放在第一行之上,并在最后一行之下。为了防止这种情况。以下进入样式表:

tr:first-child {

border-top: none;

}

tr:last-child {

border-bottom: none;

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值