<th>上的border-radius.没有边界四舍五入

Question

我有css看起来像那样:

#caltable th {
    border: solid 1px #333;
    border-radius: 7px;
    background: #f00;
}

但这是我在浏览器(Chrome/FF)中得到的:

问题是如何让黑线也圆润？

Answer 1

换border-collapse:collapse到border-collapse:separate了<table>.

您还应该添加对不是最新版本的浏览器的支持:

-moz-border-radius: 7px;
-o-border-radius: 7px;
-ms-border-radius: 7px;
-webkit-border-radius: 7px;