.foo {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 1px solid blue;
然而 Android 2.3 是不支持百分比的，要兼容我们只能使用一个较大值，比如border-radius: 999px;
二、Android 及 Safari 低版本 img 圆角问题
当 img 元素有border 时设置border-radius 会导致圆角变形，需要在img 外面嵌套一个元素并设置border 和border-radius。
图一：左侧是小米2S（Android 4.1），右侧是红米（Android 4.2）
## 三、Android 4.2.x 背景色溢出及不支持 border-radius 缩写
### 3.1 Android 4.2.x 背景色溢出
测试发现，在 Android 4.2.x 系统自带浏览器中，同时设置border-radius和背景色的时候，背景色会溢出到圆角以外部分，需要是使用background-clip: padding-box;来修复，但是如果border-color为半透明时，背景直角部分依然会露出来（参见图一）。
3.2 Android 4.2.x  不支持border-radius缩写
这个 BUG在小米上测试并未发现，国外有人反映三星 Galaxy S4 中自带浏览器不支持。
解决方案就是使用border-radius的四个扩写属性，缩写属性放到最后。
以上两个问题影响到 Android 4.2.x 内核的系统以及在其基础上定制的系统的自带浏览器，比如：红米，小米3，阿里云OS 等，安卓版 Chrome 不受影响。
完整代码应该是这样的：
.foo {
    width: 100px;
    height: 100px;
    border: 5px solid blue;
    border-top-left-radius: 999px; /* 左上角 */
    border-top-right-radius: 999px; /* 右上角 */
    border-bottom-right-radius: 999px; /* 右下角 */
    border-bottom-left-radius: 999px; /* 左下角 */
    border-radius: 999px;
    background-color: #ccc;
    background-clip: padding-box;
四、其他问题
IE9  中fieldset元素不支持border-radius。
IE9  中带有背景渐变(gradient)的时候背景溢出。
全部 Demo 截图：
感谢@方元 同学帮忙测试，欢迎反馈更多移动端 CSS 的问题。
 转载请注明出处：https://github.com/yisibl/blog/issues/2
          
刚刚在4.1.2的手机上又试了一下，发现不但要在div加border-radius,还要在img加border-radius，不然也会出现问题。

display: block;

width: 100%;

border-radius: 999px;

width: 200px;

height: 200px;

overflow: hidden;

border: 3px solid #000;

border-radius: 999px;

          
提供一个测试样本

Mozilla/5.0 (Linux; U; Android 4.2.1; zh-cn; HUAWEI G520-T10 Build/HuaweiG520-T10) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30 V1_AND_SQ_4.6.1_9_YYB_D QQ/4.6.1.1551
支持缩写, 需要加 background-clip: padding-box;
          
background-image: -webkit-gradient(linear, left top, left bottom, from(#背景色), to(#背景色)); /* Chrome, Safari 4+ /

background-image: -webkit-linear-gradient(top, #背景色, #背景色); / Chrome 10-25, iOS 5+, Safari 5.1+ /

background-image:    -moz-linear-gradient(top, #背景色, #背景色); / Firefox 3.6-15 /

background-image:      -o-linear-gradient(top, #背景色, #背景色); / Opera 11.10-12.00 /

background-image:         linear-gradient(to bottom, #背景色, #背景色); / Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */

加上面的代码也可以把背景色溢出给消去，我之前都用上面的，楼主的方法比我的简单多了，受教了
@asd0102433 这个补充真是极好的，如果我没理解错，应该需要用 CSS mask 来解决。
顶，这个问题很早就遇到过，之前也找过解决方案，最后也是找到了  mask-image。

当时还记录了下：
jsFiddle