如何在所有主要Web浏览器上支持border-radius？

Question

除了分别为每个引擎提供CSS之外,似乎没有办法支持border-radius.现在看来你必须宣告该属性三到四次(如果你想支持更多模糊的引擎,可能会更多).

我的临时解决方案是通过这个正则表达式传递我的所有CSS:

正则表达式:

border(-)?(top|bottom)?(-)?(left|right)?-radius:(.+?);

更换:

-moz-border-radius$1$2$4:$5;
-webkit-border$1$2$3$4-radius:$5;
-khtml-border$1$2$3$4-radius:$5;
border$1$2$3$4-radius:$5;

这将搜索官方CSS3选择器的所有实例,并将其替换为自身,以及Mozilla,WebKit和KHTML的特定于引擎的选择器.

有没有更好的办法？

WebKit和Mozilla何时计划支持CSS3选择器？(他们已经？)

Answer 1

它应该是 :

.myClass
{
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

边界半径低于另一个.

为什么？因为,现在新的浏览器不再需要自己的引擎黑客(比如firefox 4),他们应该使用他们在CSS文件中收到的最后一个命令.这样,在所有浏览器中理解CSS3规范时,圆角应该是相同的,您不必很快更改CSS.