CSS：颜色、背景和剪切

颜色

CSS 中可以改变文字的颜色还有元素的背景颜色。可以用颜色关键字来定义颜色，如red，但是这些颜色关键字并不常用。

transparent

transparent可以让文字或背景变的完全透明的颜色，它就像rgba(0,0,0,0)的缩写。

currentColor

currentColor代表原始的color属性的计算值。比如当前元素color为红色，背景色设置为currentColor，那么现在背景色也为红色。

rgb、rgba

颜色还可以用rgb函数表示，如rgb(255, 255, 255)代表白色，它每个参数的取值范围是0到255，它是用不同比例的红、绿、蓝来组成期望颜色。

rgba函数代表红-绿-蓝-阿尔法，其中的a是透明度，取值范围是0到1。

除了使用rgb函数，还可以使用 16 进制来表示，它的语法是#RRGGBB，如果#f3f3f3，代表f3（16 进制）数量的红-绿-蓝。如果红-绿-蓝数值两两相等，如#ffffff，就可以简写成 3 位 16 进制的形式#fff。在高版本的浏览器还可以用 16 进制表示透明度#RRGGBBAA，AA的取值范围是0到255，如果两两相等也可以简写成#RGBA形式。

hsl、hsla

hsl函数是用色相-饱和度-明度（Hue-saturation-lightness）来表示颜色，HSL相比RGB 的优点是更加直观：你可以估算你想要的颜色，然后微调，比如要找到一个颜色的相近色，只需调整一下明度就行了。

色相（Hue）表示色环（即代表彩虹的一个圆环）的一个角度。这个角度作为一个无单位的 被给出，大致按照数值红、橙、黄、绿、青、蓝、紫变化节奏。取值范围是0到360

饱和度，取值0%到100%，100% 是满饱和度，而 0% 是一种灰度。 明度，取值0%到100%，100% 明度是白色， 0% 明度是黑色，而 50% 明度是“一般的”。

hsla和rgba相似其中的a设置透明度，取值范围也是0到1。

系统颜色

系统颜色就是系统的颜色，不同的系统支持的颜色可能不同，一般很少使用。但是我们可以利用它实现系统主题风格类似的 Web 组件皮肤效果，来以假乱真。

背景

CSS2.1中有5个background属性可以用来控制元素的背景。

1. background-color
2. background-image
3. background-repeat
4. background-attachment
5. background-position

为了更好的驾驭背景图片，CSS3添加了3个新的background相关属性。

1. background-clip
2. background-origin
3. background-size
4. background-blend-mode

CSS3 中还添加了多背景渐变等等新特性。

background-image