Shorthand properties
速记属性
速记属性是CSS属性，可让您同时设置其他几个CSS属性的值。使用速记属性，Web开发人员可以编写更简洁，更易读的样式表，从而节省时间和精力。
CSS规范定义了简化属性，以便对作用于同一主题的公共属性的定义进行分组。例如，该CSS background属性是一个简写属性，是能够确定的值background-color，background-image，background-repeat，和background-position。同样，可以使用简写来定义最常见的与字体相关的属性font，并且可以使用margin简写来定义框中的不同边距。
棘手的edge案例
即使它们使用起来非常方便，在使用它们时也要记住一些edge的情况：
- 未指定的值被设置为其初始值。这听起来轶事，但它确实意味着它
覆盖了以前的设定值。因此：background-color：red; 背景：url(images/bg.gif)不重复左上方; 不会设置背景的颜色red，但是到background-color的默认，transparent作为第二个规则的优先级。
1-value语法：border-width: 1em- 唯一值表示所有边
2-value语法：border-width: 1em 2em- 第一个值表示垂直方向，即顶部和底部，边缘，第二个水平方向，即左侧和右侧。
3-value语法：border-width: 1em 2em 3em- 第一个值表示上边缘，第二个，水平，左边和右边，第三个值表示底边
4-value语法：border-width: 1em 2em 3em 4em- 四个值分别代表顶部，右侧，底部和左侧边缘，总是按顺序排列，即从顶部开始按时间顺序排列（顶部右下角和左下角的首字母匹配单词故障辅音的顺序：TRBL）
1. Similarly, shorthands handling properties related to corners of a box, like [`border-radius`](border-radius), always use a consistent 1-to-4-value syntax representing those corners:
1-value语法：border-radius: 1em- 唯一值代表所有角点
2-value语法：border-radius: 1em 2em- 第一个值表示左上角和右下角，第二个表示右上角和左下角。
3-value语法：border-radius: 1em 2em 3em- 第一个值表示左上角，第二个值表示右上角和左下角，第三个值表示右下角
4-value语法：border-radius: 1em 2em 3em 4em- 四个值分别代表左上角，右上角，右下角和左下角，总是按顺序，即从左上角开始的顺时针方向。
背景属性
具有以下属性的背景：
background-color: #000;
background-image: url(images/bg.gif
background-repeat: no-repeat;
background-position: left top;
可以简化为一个声明：
background: #000 url(images/bg.gif) no-repeat left top;
（简写形式实际上相当于上面的正手属性background-attachment: scroll，在CSS3中还有一些附加属性。）
字体属性
以下声明：
font-style: italic;
font-weight: bold;
font-size: .8em;
line-height: 1.2;
font-family: Arial, sans-serif;
可以缩写为以下内容：
font: italic bold .8em/1.2 Arial, sans-serif;
这个速记声明实际上相当于上面加号font-variant: normal和font-size-adjust: none（CSS2.0 / CSS3），font-stretch: normal（CSS3）的慢速声明。
边框属性
有了边框，宽度，颜色和样式可以简化为一个声明。例如，
border-width: 1px;
border-style: solid;
border-color: #000;
可以写成
border: 1px solid #000;
边距和填充属性
边距和填充值的速记版本以相同的方式工作。以下CSS声明：
margin-top: 10px;
margin-right: 5px;
margin-bottom: 10px;
margin-left: 5px;
与以下声明相同（请注意，值从顶部开始按顺时针顺序排列：顶部，右侧，底部，然后左侧（TRBL，“麻烦”中的辅音））
margin: 10px 5px 10px 5px;
