·border-radius 设置四个角属性。
·border-top-left-radius 左上角圆角边框。
·border-top-right-radius 又上角圆角边框。
·border-bottom-left-radius 左下角圆角边框。
·border-bottom-right-radius 右下角圆角边框。
·border-image （边框图片）复合属性，设置边框图像来填充，可以依次设置以下属性。
·border-image-source 图像来源路径。
·border-image-slice 边框背景图的分割方式。
·border-image-width 边框宽度。
·border-image-outset 边框背景图的扩展（边框图像区域超出边框的量）。
·border-image-repeat 边框图像的平铺方式：stretch拉伸/repeat重复铺满/round重复 铺满并对图像进行调整。
如：div{
border-image-source:url(a.jpg);
border-image-slice:30; //border-image-slice:30 fill; //fill图片中间部分截取填充
border-image-30px;
border-image-outset:10px;
border-image-repeat:round stretch;
}
div{
border-image:url(a.jpg) 30 /20px /10px round;//同时设置时第二、三个属性用/隔开
}
·box-shadow 向方框添加一个阴影。
·none：无阴影。
·阴影水平偏移/阴影垂直偏移/阴影模糊值/阴影外延伸/阴影颜色/inset内阴影（默认 为outset）
如：#div1{box-shadow:5px -5px 5px green;} //阴影映射方向改变
#div1:hover{box-shadow:-5px -5px 5px green;}
#div2{box-shadow:-5px 5px 5px yellow;} //阴影向外延伸效果
#div2:hover{box-shadow:-5px 5px 5px 5px yellow;}
#div3{box-shadow:-5px 5px 5px rgba(0,0,0,1);} //调配淡化阴影
#div3:hover{box-shadow:-5px 5px 5px 5px rgba(0,0,0,0.5);}
#div4{ //阴影向四周延伸
box-shadow:
0px 0px 1px 0px rgba(255,0,0,1),
0px 0px 1px 0px rgba(255,255,0,1),
0px 0px 1px 0px rgba(255,0,255,1);
}
#div4:hover{
box-shadow:
0px 0px 1px 5px rgba(255,0,0,0.5),
0px 0px 1px 10px rgba(255,255,0,0.5),
0px 0px 1px 15px rgba(255,0,255,0.5);
}