做CSS圈子最简单，最通用的方法是什么？

Question

将具有这些css属性的div转换为完美圆形的最简单，最通用的方法是什么？

div {
    background-color: red;
    padding: 5em;
}

Answer 1

用HTML元素制作圆圈的css规则是：

border-radius: 50%;

要使其在所有浏览器中都有效，请另外使用：

-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-o-border-radius: 50%;

选择JSFIDDLE DEMO

HTML

<div></div>

CSS

div{
    border-radius:50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    width:50px;
    height:50px;
    background-color:#000;
}