左右半圆
<!doctype html>
<html><head><meta charset="utf-8"><title>border-radius</title><style type="text/css">div.circle{ height:100px; width:50px; background:#9da; border-radius:0 50px 50px 0 ;右半圆/* border-radius:50px 0 0 50px;左半圆*/
}
div.circle{
width:100px;
height:50px; background:#9da; border-radius:50px 50px 0 0 ;/*上半圆/* border-radius:50px 0 0 50px;*//*下半圆*/ }
</style></head><body><div class="circle"></div></body></html>上下半圆
1、上下半圆宽度是高度的两倍
2、上半圆border-radius：右上等于高度值下左等于0 border-radius:50px 50px 0 0 ;/
3、下半圆border-radius：左上等于高度值右下等于0 border-radius:50px 0 0 50px;
左右半圆
1、左右半圆宽度是高度的一半
2、左半圆border-radius：左上等于宽度值等于0 border-radius:50px 0 0 50px;
3、右半圆border-radius：右下等于宽度值左上等于0 border-radius:0 50px 50px 0 ;