2020年2月13号--CSS文本样式学习笔记（二）

2020年2月13号–CSS文本样式学习笔记（二）

1. font-family属性
   此属性值包含多个字体作为备选

body {
   font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}

如果浏览器不支持Arial字体，则会尝试下一个字体（Helvetica Neue，Helvetica）。 如果浏览器没有任何一个，它会尝试通用的sans-serif。

2. font-size属性
   设置字体的大小属性，可以使用像素(px)或者相对单位尺寸(em)来操纵字体的大小。

3. font-style属性
   属性通常用于指定斜体文本
   font-style属性有三个值：normal，italic 和oblique。
   oblique非常类似于italic，但浏览器的支持较少。

4. font-weight属性
   font-weight控制文本的粗细，值可以设置为normal (默认)，bold，bolder，和lighter。根据文本的厚度，也可以使用从100（细） 到900（粗） 的数字来定义字体粗细。

5. font-variant属性
   font-variant属性 允许您将字体转换为所有小型大写字母。 值可以设置为normal ，small-caps ，和 inherit。

6. color属性
   color属性用于指定文本的颜色 ，定义color的其他方法是使用十六进制值和RGB。

7. text-align属性
   text-align属性指定元素中文本的水平对齐方式。 默认情况下，您网站上的文字左对齐。 但是，有时您可能需要不同的对齐方式。文本对齐属性值如下：left，right，center 和justify。
   当文本对齐设置为"justify"时，每行都被拉伸，使得每一行具有相同的宽度，并且左右边距是直的，相当于文本两端对齐。

8. vertical-align属性
   vertical-align属性设置元素的垂直对齐。常用的值是top，middle 和bottom。
   vertical-align属性还包含以下值：baseline，sub，super，% 和px(或pt，cm)。
   vertical-align属性对所有元素的行为都不一样。
   HTML代码：

<div class="main">
   <div class="paragraph">
   w3cschool
   </div>
</div>

CSS代码：

.main {
    height: 150px; width: 400px;
    background-color: LightSkyBlue;
    display: inline-table;
}
.paragraph {
    display: table-cell;
    vertical-align: middle;
}

执行结果：

9. text-decoration属性
text-decoration属性用于指定文本将如何装饰。常用的值有：
none - 默认值 ，这定义了一个正常的文本
inherit - 从其父元素继承此属性
overline - 在文本上方绘制水平线
underline - 在文本下方绘制水平线
line-through - 在文本中绘制水平线（替换HTML 标记）

10. text-indent属性
    text-indent属性指定在文本的第一行 开始之前应该留下多少水平空间（例如想向里面缩进）。属性值是长度(px，pt，cm，em等)，% 和inherit。

11. text-shadow属性
    text-shadow为文本添加阴影。它有四个值：
    第一个值： 定义阴影在x（水平）方向的距离
    第二个值： 定义y（垂直）方向的距离
    第三个值： 定义阴影的模糊
    第四个值： 设置颜色

12. text-transform属性
    text-transform可以实现文本的首字母大写效果。

13. letter-spacing属性
    letter-spacing属性用于设置文本中字符之间的间距。
    值可以设置为：
    normal 定义了默认样式，字符之间没有额外的空间;
    length 长度计量单位，用px，pt，cm，mm等测量单位定义字符之间的额外空间;
    inherit 继承其父元素的属性;
    letter-spacing使用负值可以减少字符之间的间距。

14. word-spacing属性
    word-spacing 属性 指定文本中单词之间的空格。 就像letter-spacing属性 一样，可以将word-spacing 的值设置为normal，length和inherit。要使用word-spacing设置单词之间的间距，可以使用像px，pt，pc，cm，mm，inches ，em 和ex 这样的测量值。

15. white-space属性
    white-space可以设置元素内的换行符。参数可以是normal ，inherit，nowrap 等。 nowrap会屏蔽该元素中的所有换行符。
    white-space也支持其他值：
    pre ： 文本支持所有的换行和空格
    pre-line ： 文本支持换行，忽略额外的空格
    pre-wrap ： 文本将在必要的时候或者行的结尾进行换行