CSS3边框与圆角

边框（border）

三要素

border: 1px solid #fff; //线的宽度 线的形状 线的颜色

//拆分：拆分后的小属性可以更好的层叠大属性
border-width: 1px;
border-style: solid;
border-color: #fff;

线形状

常见：

solid	实线
dashed	虚线
dotted	点状线

四个方向的边框

border-top	上边框
border-right	右边框
border-bottom	下边框
border-left	左边框

也可以：

border-top-width: 2px;
border-top-style: solid;
border-top-color: #000;

去掉边框

border-left: none;

圆角

border-radius: 表示圆角的半径

border-radius: 10px;  

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

border-top-left-radius: 50px;

/* 圆形、椭圆形 */
border-radius: 50%;

阴影

/* X偏移量 Y偏移量 模糊量 颜色 */
box-shadow: 10px 20px 30px rgba(0, 0, 0, .4);
/* X偏移量 Y偏移量 模糊量 延展 颜色 */
box-shadow: 10px 20px 30px 40px rgba(0, 0, 0, .4)
/* 向内偏移 X偏移量 Y偏移量 模糊量 延展 颜色 */
box-shadow: inset 10px 20px 30px 40px rgba(0, 0, 0, .4);
/* 多阴影 */
box-shadow: 10px 20px 30px rgba(0, 220, 0, .4),20px 20px 100px red;