创建具有圆角的表

Question

我有兴趣创建一个圆角的桌子而不使用图像。

如何实现这一目标？

我的想法是我可以用div包装表并将圆角设置为div。 通过浏览this fiddle，您可以看到表格边框覆盖了div的边框。有没有一种风格可以防止覆盖？

Answer 1

为什么不把桌子的边框拿出来？

Answer 2

这项工作的诀窍是@Luis implies，将table边框移开并应用于包裹div，将border-radius应用于那个元素。

JS Fiddle demo

Answer 3

您可以查看用于IE6 / 7/8的PIE CSS3以及用于Chrome / FF / Opera的CSS3效果（http://css3pie.com/）

Answer 4

如果您不想要表格边框，可以在表格元素上设置border:none。如果您仍想要表格边框，可以在div上设置padding:10px。