css – 如何在表行上添加边框半径

前端之家收集整理的这篇文章主要介绍了css – 如何在表行上添加边框半径前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
有谁知道如何风格tr,我们喜欢吗?

我使用border-collapse在表,之后tr可以显示1px实体边框我给他们。

然而,当我尝试-moz-border-radius,它不工作。即使简单的利润也不行。

解决方法

您只能将border-radius应用于td,而不是tr或表。我已经通过使用这些样式围绕这个圆角表:
table { border-collapse: separate; }
td { border: solid 1px #000; }
tr:first-child td:first-child { border-top-left-radius: 10px; }
tr:first-child td:last-child { border-top-right-radius: 10px; }
tr:last-child td:first-child { border-bottom-left-radius: 10px; }
tr:last-child td:last-child { border-bottom-right-radius: 10px; }

请务必提供所有供应商前缀。这是一个example of it in action

猜你在找的CSS相关文章