CSS3-边框（border-radius、box-shadow、border-image）

CSS3中的边框属性：border-radius、box-shadow、border-image

圆角：border-radius

使用 CSS3 border-radius 属性，你可以给任何元素制作 "圆角"。

如果你在 border-radius 属性中只指定一个值，那么将生成 4 个圆角。

但是，如果你要在四个角上一一指定，可以使用以下规则：

css3圆角属性：

box-shadow属性可以设置一个或多个下拉阴影的框，

语法：box-shadow: h-shadow v-shadow blur spread color inset;

boxShadow 属性是一个用逗号分隔阴影的列表，每个阴影由 2-4 个长度值、一个可选的颜色值和一个可选的 inset 关键字来规定。省略长度的值是 0。

有了 CSS3 的 border-image 属性，你可以使用图像创建一个边框，border-image 属性允许你指定一个图片作为边框，用于创建上文边框的原始图像。

border-image属性是速记属性用于设置 border-image-source, border-image-slice, border-image-width, border-image-outset 和border-image-repeat 的值，省略的值设置为它们的默认值。

语法：border-image: source slice width outset repeat|initial|inherit;

值	描述
border-image-source	用于指定要用于绘制边框的图像的位置
border-image-slice	图像边界向内偏移
border-image-width	图像边界的宽度
border-image-outset	用于指定在边框外部绘制 border-image-area 的量
border-image-repeat	用于设置图像边界是否应重复（repeat）、拉伸（stretch）或铺满（round）。