【CSS常用文本属性】
1、 字体、字号类：
① font-weight： 字体粗细。 bold-加粗、normal-正常、lighter-细体
也可以使用100-900数值，400表示normal，700表示bold
② font-style: 字体样式。 italic-倾斜、normal-正常
③ font-size: 字号。 可以写px单位，也可以写%
200%表示浏览器默认大小(16px)的两倍=32px
④ font-family: 字体系列(字体族)。
>>> 可以直接写字体名，也可以写字体系列名。
>>> 常用字体系列：serif-衬线体 sans-serif-非衬线体；
>>> font-family可以接收多个值，用逗号分隔。表示优先使用第一个，如果没有这个字体，依次向后使用。 通常，最后一个值放字体系列名；
eg: font-family: "黑体","微软雅黑",sans-serif; ⑤ font缩写形式：
>>> 顺序必须是：
font-weight font-style font-size/line-height font-family
>>> 不同属性之间，用空格分隔；
>>> font-size/line-height必须一组，用/分隔；
>>> font-family多个字体之间，用逗号分隔
>>> eg： font: bold italic 32px/50px "微软雅黑",serif;
2、 字体颜色
① color： 字体颜色 可以使单词、十六进制、RGB等
② opacity： 透明度，可选值0-1
[opacity和RGBA的区别]
>>> RGBA本身可以设置颜色，而opacity必须配合其他颜色属性来用；
>>> rgba仅仅是让当前元素设置的颜色透明；
而opacity，会让当前元素里面的所有文字、背景、子元素都透明；
3、行距、对齐、其他类
① line-height: 行高。 可以写px单位、可以直接写数字(表示默认行距的几倍)、可以写% (表示默认行距的百分比)
>>> 行高重要作用： 让单行文字在div中垂直居中？
设置行高等于div的高度，即可让单行文字垂直居中。
② text-align：设置区域内的行级元素水平对齐方式left/center/right
③ letter-spacing： 字符间距，字与字之间的距离
④ text-decoration: 文本修饰；
underline-下划线、overline-上划线、line-through-删除线、none
⑤ overflow： 设置超出区域文字的显示方式。
>>> overflow: hidden; 超出区域的文字隐藏不显示；
>>> overflow: scroll; 无论文字多少，都会显示水平垂直滚动条
>>> overflow: auto; 自动。文字多显示滚动条，文字少，不显示滚动条。
>>> 可以使用overflow-x和overflow-y单独修改两个方向的滚动条
overflow-y: scroll; overflow-x: hidden;
⑥ text-overflow：设置行末多余文字的显示方式；
>>> clip-多余文字裁剪掉 ellipsis-多余文字省略号显示
>>> 显示省略号，需要配合white-space: nowrap;使用
>>> 【重点】 设置行末显示省略号(三行代码，缺一不可)
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
⑦ white-space: nowrap; 设置中文行末，不断行显示
⑧ text-indent: 首行缩进。
⑨ -webkit-text-stroke: 0.5px blue; 文字描边。
-webkit-表示只有webkit内核浏览器生效、常见的有chrome、safari
⑩ text-shadow: 文字阴影，有四个属性值，空格分隔；
>>> 水平阴影距离，正数表示阴影右移，负数左移；
>>> 垂直阴影距离，正数表示阴影下移，负数上移。
>>> 阴影模糊距离， 0表示阴影一点不模糊；
>>> 阴影的颜色；
>>> eg:text-shadow: 20px -10px 2px blue;
【CSS常用背景属性】
1、 background-color： 背景色
2、 background-image: 背景图。使用url("")选择背景图片。背景图和背景色同时存在时，背景图覆盖背景色。
3、 background-repeat: 背景图的重复方式。
no-repeat-不平铺、repeat-平铺、repeat-x-x轴平铺、 repeat-y-y轴平铺
4、 background-size： 背景图的大小
[指定宽度高度]
>>> 宽度高度的指定，可以写px，也可以写%(父容器宽高的百分比)
>>> 当写两个属性时，分别表示宽度、高度；
当写一个属性时，表示宽度，高度将会等比缩放；
[其他属性值]
>>> contain: 图片等比缩放，直到宽或高中较大的一边缩放到100%为止。(可能导致较短的一边<100%,图片无法盖住全部区域)
>>> cover： 图片等比缩放，直到宽或高中较小的一边缩放到100%为止。(可能导致较大的一边>100%,图片超出区域显示不全)
5、 background-position： 背景图偏移量
>>> 指定位置： left/center/right top/center/bottom
当，只写一个值时 ，另一个默认居中。
>>> 指定坐标： 两个属性分别表示 ：水平位移 垂直位移
① 坐标的值，可以是px单位，也可以是百分数 ② 当写px单位时：
水平方向：正数右移 负数左移 ； 垂直方向： 正数下移 负数上移；
(左负右正 上负下正)
③ 当写%百分数时：
一般只能是正数。表示的是，去掉图片的宽高，剩余空白区域的分布比例。 eg：background-position:30%; 水平方向去掉图片宽度，剩余区域3:7分。