边框与圆角

border边框

css
div {
/*四个值，顺时针排列*/
    border-radius: top right bottom left;
/*两个值，第一个值表示左上和右下，第二个值表示左下和右上*/
    border-radius: a b;
/*三个值，上、左右、下*/
   border-radius:2px 1px 2px;
}

轮廓

css
outline: ：outline-color, outline-style, outline-width;

参数

outline-color： 规定边框的颜色
outline-style：规定边框的样式
outline-width： 规定边框的宽度
inherit： 规定应该从父元素继承

特点

1. 轮廓不会占据位置，不会影响附近边框

投影

用途

用于设置元素投影

css
div {
box-shadow: innset x-shadow y-shadow blur spread color
}

参数

inset：内部阴影
x-shadow: 水平方向投影，为0时左右两侧投影相等
y-shadow: 竖直方向投影，为0时上下两侧投影相等
blur: 模糊半径(值越大，模糊效果越强)
spread: 阴影尺寸
color: 投影颜色

特点

1. 不会影响元素位置