CSS3基础——边框，背景，文字，颜色

1. 圆角效果 border-radius
   单位:px 和%

2. 阴影 box-shadow
   box-shadow: h-shadow v-shadow blur spread color inset;
   常用四属性：X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影颜色];
   投影方式：inset，默认为外阴影。

3. 为边框应用图片 border-image
   background:url(xx.jpg) 10px 20px no-repeat;

4. RGBA：color：rgba(R,G,B,A)；

5. 渐变颜色：
   线性渐变（Linear Gradients）- 向下/向上/向左/向右/对角方向
   径向渐变（Radial Gradients）- 由它们的中心定义
   第一个参数省略时，默认为“180deg”，等同于“to bottom”
   第二个和第三个参数，表示颜色的起始点和结束点，可以有多个颜色值。

6. opacity，不透明度
   opacity: value；

7. 文字与字体text-overflow 与 word-wrap
   text-overflow 用来设置是否使用一个省略标记（…）标示对象内文本的溢出。

8. 文本阴影text-shadow
   Text-shadow:X-offset Y-offset blur color;
   类似于box-shadow

9. background-origin：
   background-origin ： border-box | padding-box | content-box;
   从边框，还是内边距（默认值），或者是内容区域开始显示
   背景需要设置no-repeat属性

10. background-clip：用来将背景图片做适当的裁剪以适应实际需要。

11. background-size：设置背景图片的大小，以长度值或百分比显示，还可以通过cover和contain来对图片进行伸缩。
    background-size: auto | <长度值> | <百分比> | cover | contain

12. 组合式写法
    background ： [background-color] | [background-image] | [background-position][/background-size] | [background-repeat] | [background-attachment] | [background-clip] | [background-origin],...

    1. 用逗号隔开每组 background 的缩写值；
    2. 如果有 size 值，需要紧跟 position 并且用 “/” 隔开；
    3. 如果有多个背景图片，而其他属性只有一个（例如 background-repeat 只有一个），表明所有背景图片应用该属性值。
    4. background-color 只能设置一个。