####圆角border-radius

语法： border-radius：value； 四个角 border-radius：value value； 左上右下 以及 右上左下 border-radius：value value value value； 代表设置对象左上角、右上角、右下角、左下角 （顺时针）

设置圆角的最完整格式 2个参数 8个值：/前面的是水平方向的（顺时针），/后面的是垂直方向的 border-radius: 10px 20px 30px 40px / 10px 20px 30px 40px;

关于圆角的形成方式： 1.从指定角的顶端，向内部引出垂直半径和水平半径 ——>所以px值越大，圆越明显 2.将水平半径和垂直半径相较于元素内部的一点(圆心点) 3.以该点为圆心，指定的垂直半径和水平半径画圆或椭圆 4.与边框相交的部分就是圆角部分。

下面两种也可以：

/*border-radius:10px / 20px 10px;*/
/*border-radius:10px 20px 30px 40px / 20px 10px;*/

例：

#box1{
    width:200px;
    height:40px;
    border:1px solid blue;
    border-radius: 10px 10px 0px 0px;
}
#box2{
    width:200px;
    height:400px;
    border:1px solid green;
    border-radius: 0px 0px 10px 10px;
}

画一个圆：

#box3{
    width:200px; /*直径*/
    height:200px;
    border:1px solid blue;
    border-radius:100px;
}

一半实心、一半空心的：

#box4{
    width:100px;
    height: 200px;
    border: 1px solid blue;
    border-left:100px solid blue; /*左边框和半径一样粗*/
    border-radius: 100px;
}