如何仅删除html表中指定行的底部边框

前端之家收集整理的这篇文章主要介绍了如何仅删除html表中指定行的底部边框前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我有简单的html表,我想在特定行上删除tr的底部边框.

桌子

我试过的是将类添加到tr我想要的没有底部边界类=“no-bottom-border”并用css删除

tr .no-bottom-border {border-bottom: none}

这似乎不起作用.这是桌子上的JSFIDDLE

最佳答案
定位td的边框,因为tr没有边框属性.

演示

table,caption,tbody,tfoot,thead,tr,th,td {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

table {
  border: 1px solid #ccc;
  color: #37393b;
  margin: 10px 0 0 0;
  text-shadow: #fff 1px -1px 1px;
  text-align: left;
  width: 100%;
}

table tbody tr td {
  background: #FFF;
  border-bottom: 1px dotted #d00;
}

tr.no-bottom-border td {
  border-bottom: none
}

猜你在找的HTML相关文章