如何在不打乱边框的情况下在表行上加删除线

在不打乱边框的情况下在表行上加删除线，可以通过CSS的伪元素和定位来实现。具体步骤如下：

1. 首先，给表格行的父元素（通常是<tbody>）添加一个相对定位的样式，例如：

tbody {
  position: relative;
}

1. 然后，使用伪元素::before或::after来创建一个绝对定位的元素，作为删除线。例如，我们可以使用::before来创建一个删除线：

tbody::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  border-bottom: 1px solid red; /* 设置删除线的样式 */
  transform: translateY(-50%); /* 将删除线居中对齐 */
}

1. 最后，为了保证删除线不会覆盖表格的边框，我们可以给表格行添加一个边框样式，例如：

tr {
  border-bottom: 1px solid transparent; /* 设置表格行的边框样式 */
}

这样，就可以在不打乱边框的情况下在表行上加上删除线了。

这种方法适用于任何表格，无论是静态表格还是动态生成的表格。删除线的样式可以根据需要进行调整，例如修改颜色、粗细等。

腾讯云相关产品和产品介绍链接地址：

• 腾讯云官网：https://cloud.tencent.com/
• 云服务器（CVM）：https://cloud.tencent.com/product/cvm
• 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
• 云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
• 云存储（COS）：https://cloud.tencent.com/product/cos
• 腾讯云区块链服务（BCS）：https://cloud.tencent.com/product/bcs