1、CSS outline 属性
outline （轮廓）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。
p
{
outline:#00FF00 dotted thick;
}
2、CSS border-radius 属性
border-radius 属性是一个简写属性，用于设置四个 border-*-radius 属性。
例子1：一个参数的时候
border-radius:2em;
等价于
border-top-left-radius:2em;
border-top-right-radius:2em;
border-bottom-right-radius:2em;
border-bottom-left-radius:2em;
如图：
例子2：两个参数的时候
border-radius:2em 5em;
/*左上角和右下角为2em圆弧，右上角和左下角为5em圆弧*/
等价于
border-top-left-radius:2em;
border-top-right-radius:5em;
border-bottom-right-radius:2em;
border-bottom-left-radius:5em;
如图：
例子3：三个参数的时候
border-radius:2em 5em 8em;
/*左上角为2em圆弧，右上角和左下角为5em圆弧，右下角为8em圆弧*/
等价于
border-top-left-radius:2em;
border-top-right-radius:5em;
border-bottom-right-radius:8em;
border-bottom-left-radius:5em;
如图：
例子4：四个参数的时候
border-radius: 2em 1em 5em 4em;
等价于
border-top-left-radius: 2em;
border-top-right-radius: 1em;
border-bottom-right-radius: 5em;
border-bottom-left-radius: 4em;
如图：
例子5：带斜杠 / 的时候
border-radius: 2em 1em 5em 4em / 0.5em 3em 2em 4em;
/*以斜杠 / 分开后面的参数的意思是：第一个参数表示圆角的水平半径，第二个参数表示圆角的垂直半径，这样可以画一个不对称的圆角辣*/
等价于
border-top-left-radius: 2em 0.5em;
border-top-right-radius: 1em 3em;
border-bottom-right-radius: 5em 2em;
border-bottom-left-radius: 4em 4em;
如图：
通常我们很少写斜杠 / 右边的参数，那就是默认右边等于左边的值。你也可以省略一些值，比如这样子写
border-radius: 2em 1em 4em / 0.5em 3em;
解析顺序你就可以按照上面的自己推算一下啦。
3、CSS border-shadow 属性
box-shadow 属性向框添加一个或多个阴影。
语法：
box-shadow: h-shadow v-shadow blur spread color inset;
注释：box-shadow 向框添加一个或多个阴影。该属性是由逗号分隔的阴影列表，每个阴影由 2-4 个长度值、可选的颜色值以及可选的 inset 关键词来规定。省略长度的值是 0。
| 值 | 描述 |
|---|---|
| h-shadow | 必需。水平阴影的位置。允许负值。 |
| v-shadow | 必需。垂直阴影的位置。允许负值。 |
| blur | 可选。模糊距离。 |
| spread | 可选。阴影的尺寸。 |
| color | 可选。阴影的颜色。请参阅 CSS 颜色值。 |
| inset | 可选。将外部阴影 (outset) 改为内部阴影。 |