将 CSS 框转换为圆角？

【问题标题】：Convert CSS Box to Rounded Corner?将 CSS 框转换为圆角？
【发布时间】：2013-10-02 05:05:52
【问题描述】：

我有一段时间没有深入研究 HTML...我正在尝试将此框转换为相同的大小/形状但带有圆角。查看圆角的语法，我不确定如何在圆角中使用最大高度/宽度？

这是我当前的 div 标签：

    <div id="content" style="background: rgba(0, 0, 0, 0.4);">
    <div style="max-height: 600px; max-width: 700px;">
    [content]
    </div>
    </div>

任何帮助表示赞赏！

【问题讨论】：

标签： html css rounded-corners

【解决方案1】：

您可以添加边框半径规则...不会有问题。

<div style="max-height: 600px; max-width: 700px; border-radius: 10px;"></div>

或者...

<div class="med-round"></div>

.med-round {
    max-height: 600px; 
    max-width: 700px; 
    border-radius: 10px;
}

【讨论】：

errrr，比我预期的要容易得多。那成功了。谢谢！

【解决方案2】：

如上所述，可以使用border-radius属性，但我要补充：

-别忘了添加 webkit 前缀：

#content{
-webkit-border-radius: 4px;
border-radius: 4px;
}

-不要忘记检查此功能或其他功能是否可以跨浏览器使用（border-radius 不适用于 IE8）

您可能会发现这些链接很有用： http://caniuse.com/ http://css3generator.com/

【讨论】：