使用border-radius经常是直接用四个以下的参数,再看到“/”分开可以达到四个以上参数时瞬间懵了,记录一下:
完整的border-radius写法

border-radius:1 2 3 4 / 5 6 7 8

分别对应下图的位置

.box {
            width: 100px;
            height: 100px;
            background-color: yellow;
            border-radius: 50px / 20px 20px 40px 40px ;
             }

此时1,2,3,4都为50px,可以绘制出各种不一样的图形

顺带提一下兼容性问题:
IE9+,FireFox4+,Chrome,Safari5+,Opera
遇到低版本浏览器需要加前缀
-webkit- ~ Chrome
-moz- ~ FireFox
-ms- ~ IE
-o- ~ Opera