创建跨浏览器兼容的圆形边框的最佳方法是什么？ [复制]答案

【问题标题】：What is the best way to create rounded borders that are cross browser compatible? [duplicate]创建跨浏览器兼容的圆形边框的最佳方法是什么？ [复制]
【发布时间】：2012-09-19 23:32:13
【问题描述】：

可能重复：
Cross-browser curved borders

我想创建包含设计边框的 div 和其他元素。边框将是基本的 CSS 就绪边框。虽然我可以编写代码，但我想知道使圆角边框属性跨浏览器兼容的最佳方法和过程。（至少在被广泛接受的浏览器中（Chrome、Firefox、IE、Safari）。任何指针？

【问题讨论】：

你可以看看这个curvycorners.net
border-radius.com 生成带有所有必要前缀的 CSS。可以作为参考。
davidwalsh.name/css-rounded-corners这个也是

标签： html rounded-corners css

【解决方案1】：

  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  -khtml-border-radius: 20px;
  border-radius: 20px;

Source

【讨论】：

【解决方案2】：

Internet Explorer（从第 9 版开始）、Firefox（从第 4 版开始）、Chrome、Safari 和 Opera 已经支持 border-radius 属性。但是，如果你想确定你可以使用这样的东西：

.border-radius {
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

希望对你有帮助。

【讨论】：

【解决方案3】：

看看这个有用的网站 http://www.css3.info/preview/rounded-border/ 它有解释和工作示例另请查看 W3C 建议。非常有帮助 http://www.w3.org/TR/css3-background/#corner-shaping

【讨论】：