CSS参考

取色

css支持多种取色方式。下面会列举取色的方法。

16进制取色（HEX）

格式：#ABCDEF #001234（如果需要加上通道alpha值，那么则会变为#ABCDEFCC #001234CC）

16进制取值为0~F，如下是取色的一些实例
这是黑色（#000000）

这是蓝色（#12425F）

当然，上述颜色未加上alpha值，加上alpha值可以调整颜色的不透明度
这是黑色,50%不透明度（#00000080）

这是黑色,75%不透明度（#000000BF）

下面附上各种不透明度对应的16进制数值
不透明度 16进制数值
100% FF
95% F2
90% E6
85% D9
80% CC
75% BF
70% B3
65% A6
60% 99
55% 8C
50% 80
45% 73
40% 66
35% 59
30% 4D
25% 40
20% 33
15% 26
10% 1A
5% 0D
0% 00

RGB取色

格式：rgb(127,127,127) （如果需要加上通道alpha值，则会是rgba(127,127,127,127,0.5)。注：0.5也可以写成50%）

RGB的取值为3个，每个都为0~255。第一个对应红色，第二个对应绿色，第三个对应蓝色。颜色是从黑色开始的，rgb(0,0,0)是黑色，rgb(255,255,255)是白色。
这是黑色（rgb(0,0,0)）

这是蓝色（rgb(18,66,95)）
当然，上述颜色未加上alpha值，加上alpha值可以调整颜色的不透明度

这是黑色,50%不透明度（rgba(0,0,0,0.5)）

这是黑色,75%不透明度（rgba(0,0,0,0.75）)

HSL取色

格式：hsl(240,50%,50%)（如果需要加上通道alpha值，则会是hsla(240,50%,50%,0.5)）

HSL的取值分别为：色相，饱和度，亮度。后面可以加上不透明度。

渐变色

linear-gradient参数可以实现渐变色，其格式如下。

background-image:linear-gradient(180deg, red 0%, green 50%, blue 100%)

有4个参数，但是其中有一些可以省略。例如如果第一个参数（180deg）不写，默认值就是180deg。而在每个颜色后面的百分数也可以省略。对于3个颜色，那么第一个颜色就是0%，第二个颜色就是50%，第三个颜色就是100%。

下面是渐变色的示例。

从左到右渐变：

.

从上到下渐变：

.

[admonition color="blue" title="注意"]1.此参数最少需要2个颜色才能正常工作！
2.此参数是作为背景图像调用的，前方需要有background-image:[/admonition]

Viewport移动端适应

<meta name="viewport" content="width=device-width, initial-scale=1.0">