css文本属性

## CSS字体 ，文本属性### 1、css字体#### 1.1 font-family- 作用：设置文本的字体系列- 语法：font-family:字体名称；- 常用值：  - 一个字体名称或系列名称（介绍常用字体名称、字体系列）    - 微软雅黑   Microsoft YaHei    - 宋体      SimSun    - 黑体     HeiTi    - 楷体     KaiTi  - 多个字体名称    - 逗号分开      如果浏览器不支持第一个字体，则会尝试下一个（回退机制）      ```css      .box{          /*font-family:"微软雅黑","宋体";*/          /*font-family:"宋体","微软雅黑"; *//*与上一个相比产生的效果不同，谁在前使用哪一个*/          font-family:"微软雅黑abc","宋体";           /*第一个任意改写一个系统不存在的字体，会按照第二个字体显示*/      }      ```- 注意:如果字体名称包含空格、汉字、特殊字符，必须加引号!  ```css  .box{font-family: "Microsoft YaHei";}  ```#### 1.2 font-size- 作用：设置字体的大小- 语法：font-size:值；- 常用值：  - 长度值（通常是像素px）  - 百分比（相对于父元素计算）  - em相对单位    如果用于字号，相当于父元素字号计算，如果用于其它属性，相对于当前元素的字号- 大多数浏览器的默认值字号：16px#### 1.3 font-style- 作用：设置字体的大小- 语法：font-style:值；- 常用值：  - normal默认值  - italic斜体显示#### 1.4 font-weight- 作用：设置字体粗细- 语法：font-weight:值；- 常用值：  - normal默认值  - bold加粗  - 100-900九级字重，400相当于normal，700相当于bold  - **注意**：不是所有字体都内置了九级字重#### 1.5 line-height- 作用：设置行高（效果是产生文本行间距）- 语法：line-height:值；- 特性：实现单行文本的垂直居中- 测量：文字高+行间距- 常用值  - normal默认。设置合理的行间距。- px 设置固定的行间距。  - number设置数字，此数值会与当前的字号相乘来设置行间距。  - 百分比:相对于font-size计算   ```css  .box{    /*line-height:2;*/   line-height:200%; /*产生的效果一致都是字号的两倍*/  }  ```#### 1.6 font简写- 作用：设置所有字体属性- 语法：  font: 字体风格 字体加粗 字号/行高  字体；- 总结：  只有当【字号和字体】同时存在简写才是有效的，简写属性可以精简代码  ```css  .box2{   /* font:italic bold 20px "宋体"; */   font:20px "宋体";  }  ```### 2、css文本#### 2.1 text-align- 作用：设置文本的水平对齐方式- 语法：text-align:值；- 常用值  - left居左对齐 [默认值]  - right居右对齐  - center居中对齐  - justify两端对齐- 注意：适用于块状元素#### 2.2  text-decoration- 作用：设置文本装饰- 语法：text-decoration:值；- 常用值  - none 默认。定义标准的文本。 【常用】  - underline 定义文本下的一条线 【常用】  - line-through 定义穿过文本的一条线。【比较常用】  - overline 定义文本上的一条线。 【不常用】#### 2.3 text-indent- 作用：设置文本块首行的缩进- 语法：line-height:值；- 常用值  - 默认值：0  - 长度值，px,em(更方便)  - 百分比: 相对于元素内容宽进行计算  - 允许负值#### 2.4 color- 作用：设置文字的颜色- 语法：color:颜色值；- 常用值  - 颜色的常用表式方法    - 颜色名称：如red、blue等    - 十六进制颜色表示方法      - 语法：如#ff0000      - 说明：#rrggbb        r,g,b取值范围为00-ff         - r red  红色        - g green 绿色        - b  blue 蓝色      - 认识常见颜色的写法  - 白色（#ffffff）、黑色（#000000）        红色（#ff0000）、绿色(#00ff00)、蓝色(#0000ff)- rgb颜色表示方法  - 语法：rgb(255,0,0)    - 说明：rgb(r,g,b)      r,g,b取值范围为0-255       - 认识常见颜色的写法        - 白色： rgb(255,255,255) 、黑色 : rgb(0,0,0)           红色： rgb(255,0,0) 、绿色： rgb(0,255,0) 、蓝色： rgb(0,0,255)   ### 3、文本属性继承性简单渗透:字体文本属性大多具有继承性。>可继承的属性>font-size>font-family>font-style>font-weight>font>line-height>text-align>text-indent>color>>不可继承