强大的CSS:颜色、背景和剪切-创新互联
颜色
CSS 中可以改变文字的颜色还有元素的背景颜色。可以用颜色关键字来定义颜色,如
red
,但是这些颜色关键字并不常用。
transparent
transparent
可以让文字或背景变的完全透明的颜色,它就像
rgba(0,0,0,0)
的缩写。
currentColor
currentColor
代表原始的
color
属性的计算值。比如当前元素
color
为红色,背景色设置为
currentColor
,那么现在背景色也为红色。
rgb、rgba
颜色还可以用
rgb
函数表示,如
rgb(255, 255, 255)
代表白色,它每个参数的取值范围是
到
255
,它是用不同比例的红、绿、蓝来组成期望颜色。
rgba
函数代表红-绿-蓝-阿尔法,其中的
a
是透明度,取值范围是
到
1
。
除了使用
rgb
函数,还可以使用 16 进制来表示,它的语法是
#RRGGBB
,如果
#f3f3f3
,代表
f3
(16 进制)数量的红-绿-蓝。如果红-绿-蓝数值两两相等,如
#ffffff
,就可以简写成 3 位 16 进制的形式
#fff
。在高版本的浏览器还可以用 16 进制表示透明度
#RRGGBBAA
,
AA
的取值范围是
到
255
,如果两两相等也可以简写成
#RGBA
形式。
hsl、hsla
hsl
函数是用色相-饱和度-明度(Hue-saturation-lightness)来表示颜色,
HSL
相比
RGB
的优点是更加直观:你可以估算你想要的颜色,然后微调,比如要找到一个颜色的相近色,只需调整一下明度就行了。
色相(Hue)表示色环(即代表彩虹的一个圆环)的一个角度。这个角度作为一个无单位的 被给出,大致按照数值红、橙、黄、绿、青、蓝、紫变化节奏。取值范围是
到
360
饱和度,取值
0%
到
100%
,100% 是满饱和度,而 0% 是一种灰度。 明度,取值
0%
到
100%
,100% 明度是白色, 0% 明度是黑色,而 50% 明度是“一般的”。
hsla
和
rgba
相似其中的
a
设置透明度,取值范围也是
到
1
。
系统颜色
系统颜色就是系统的颜色,不同的系统支持的颜色可能不同,一般很少使用。但是我们可以利用它实现系统主题风格类似的 Web 组件皮肤效果,来以假乱真。
文章名称:强大的CSS:颜色、背景和剪切-创新互联
网页网址:http://myzitong.com/article/cosphh.html