本文参与4月更文挑战，打卡day7，第七篇

3. 颜色

预定义的颜色值

black、white、red、green、blue、lightblue等。

16进制表示法

使用6位16进制数表示颜色，例如：#ADD8E6。

其中第1-2位表示红色，第3-4位表示绿色，第5-6位表示蓝色。

简写方式：#ABC，等价于#AABBCC。

RGB表示法

rgb(173, 216, 230)

其中第一个数表示红色，第二个数表示绿色，第三个数表示蓝色。

RGBA表示法

rgba(173, 216, 230, 0.5)

前三个数同上，第四个数表示透明度。

透明度取值[0,1]，数字越小透明程度越高

取色方式

• 网页里的颜色，可以在chrome的调试模式下获取
• 其他颜色可以使用QQ的截图软件：
  • 直接按c键，可以复制rgb颜色值
  • 按住shift再按c键，可以复制16进制颜色值

4. 文本

text-align

定义行内内容（例如文字）如何相对它的块父元素对齐。text-align 并不控制块元素自己的对齐，只控制它的行内内容的对齐。子标签可以继承父标签的属性。

center：表示居中对齐
right：右对齐
left：左对齐
justify：两端对齐（对最后一行无效）
justify-all （实验中）：justify 一致，但是强制使最后一行两端对齐。

line-height

设置多行元素的空间量，如多行文本的间距。

对于块级元素，它指定元素行盒（line boxes）的最小高度。对于非替代的 inline 元素，它用于计算行盒（line box）的高度。

垂直居中的方法：设置line-height和height相同即可

单位	描述
px	  设备上的像素点[绝对单位]
%	    相对于父元素的百分比
em	  相对于当前元素默认字体大小[使用较多]
rem	  相对于根元素的字体大小[使用较多]
vw	  相对于浏览器窗口宽度的百分比
vh	  相对于浏览器窗口高度的百分比
vh/vw：无论如何缩放屏幕，窗口都能呈现（保持一定的宽高）

第一层div的默认字体大小是16px，两倍之后是32px；

第一层的32px会被继承到第二层，因此第二层的默认字体大小就是32px，两倍之后是64px；

同样的，第三层会继承第二层的64px字体大小，因此第三层默认字体大小是64px，两倍之后就变成了128px。所以呈现出来了字号一层比一层大的样式。

letter-spacing

设置文本字符的间距（可以取小数）

text-indent

定义一个块元素首行文本内容之前的缩进量（eg.段前缩进两字符）

text-decoration

设置文本的修饰线外观的（下划线、上划线、贯穿线/删除线 或 闪烁）是 text-decoration-line, text-decoration-color, text-decoration-style, 和新出现的 text-decoration-thickness 属性的缩写

underline：下划线
underline dotted：点状下划线
wavy underline：波浪线
none：删除下划线（超链接去下划线）

text-shadow

为文字添加阴影。可以为文字与 text-decorations 添加多个阴影，阴影值之间用逗号隔开。
每个阴影值由元素在X和Y方向的偏移量(属性值的前两个参数)、模糊半径（属性值第三个参数）和颜色（属性值第四个参数）组成。

属性值可以写负数

5. 字体

font-size

指定字体的大小。因为该属性的值会被用于计算em和ex长度单位，定义该值可能改变其他元素的大小。

px                    像素
em                    相对于父元素字体的大小
rem                   相对于根元素(html)字体的大小,常用于适配
ex                    当前字体的x-height或者一个em的一半（相对于当前元素）
%                     相对于父元素的百分比
vw                    窗口宽度的1%
vh                    窗口高度的1%

font-style

可以选择 font-family 字体下的 italic（斜体） 或 oblique（斜体）样式。

italic是字体自带的斜体属性，oblique是使字体向右倾斜。但是，并不是所有字体都具有斜体的样式，对于那些没有斜体样式的字体来说，使用italic是没有效果的，此时就可以利用oblique代替italic来实现字体倾斜的效果

更多关于oblique和italic的区别参考CSDN社区文章

font-weight

指定了字体的粗细程度。一些字体只提供 normal 和 bold 两种值。

font-family

允许您通过给定一个有先后顺序的，由字体名或者字体族名组成的列表来为选定的元素设置字体。属性值用逗号隔开。浏览器会选择列表中第一个该计算机上有安装的字体，或者是通过@font-face 指定的可以直接下载的体。

6. 背景

background-color

设置元素的背景色, 属性的值为颜色值或关键字”transparent背景色透明，默认也是透明的”

background-image

为一个元素设置一个或者多个背景图像

渐变色：linear-gradient(rgba(0, 0, 255, 0.5), rgba(255, 255, 0, 0.5))