[TOC] ## CSS 文本 >[info] CSS 文本属性可定义文本的外观。通过文本属性,您可以改变文本的颜色、字符间距,对齐文本,装饰文本,对文本进行缩进,等等。 <table class="dataintable"> <tbody> <tr> <th> 属性 </th> <th> 描述 </th> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_text_color.asp"> * color </a> </td> <td> 设置文本颜色 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_text_direction.asp" title="CSS direction 属性"> direction </a> </td> <td> 设置文本方向。 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_dim_line-height.asp"> * line-height </a> </td> <td> 设置行高。 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_text_letter-spacing.asp" title="CSS letter-spacing 属性"> letter-spacing </a> </td> <td> 设置字符间距。 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_text_text-align.asp" title="CSS text-align 属性"> * text-align </a> </td> <td> 对齐元素中的文本。 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_text_text-decoration.asp"> * text-decoration </a> </td> <td> 向文本添加修饰。 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_text_text-indent.asp" title="CSS text-indent 属性"> text-indent </a> </td> <td> 缩进元素中文本的首行。 </td> </tr> <tr> <td> text-shadow </td> <td> 设置文本阴影。CSS2 包含该属性,但是 CSS2.1 没有保留该属性。 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_text_text-transform.asp"> text-transform </a> </td> <td> 控制元素中的字母。 </td> </tr> <tr> <td> unicode-bidi </td> <td> 设置文本方向。 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_text_white-space.asp" title="CSS white-space 属性"> white-space </a> </td> <td> 设置元素中空白的处理方式。 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_text_word-spacing.asp" title="CSS word-spacing 属性"> word-spacing </a> </td> <td> 设置字间距。 </td> </tr> </tbody> </table> >[danger]提醒:带*号为常用属性 ## CSS 字体 >[info] CCSS 字体属性定义文本的字体系列、大小、加粗、风格(如斜体)和变形(如小型大写字母)。 <table class="dataintable"> <tbody> <tr> <th> 属性 </th> <th> 描述 </th> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_font_font.asp" title="CSS font 属性"> font </a> </td> <td> 简写属性。作用是把所有针对字体的属性设置在一个声明中。 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_font_font-family.asp" title="CSS font-family 属性"> * font-family </a> </td> <td> 设置字体系列。 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_font_font-size.asp" title="CSS font-size 属性"> * font-size </a> </td> <td> 设置字体的尺寸。 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_font_font-size-adjust.asp" title="CSS font-size-adjust 属性"> font-size-adjust </a> </td> <td> 当首选字体不可用时,对替换字体进行智能缩放。(CSS2.1 已删除该属性。) </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_font_font-stretch.asp" title="CSS font-stretch 属性"> font-stretch </a> </td> <td> 对字体进行水平拉伸。(CSS2.1 已删除该属性。) </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_font_font-style.asp" title="CSS font-style 属性"> font-style </a> </td> <td> 设置字体风格。 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_font_font-variant.asp" title="CSS font-variant 属性"> font-variant </a> </td> <td> 以小型大写字体或者正常字体显示文本。 </td> </tr> <tr> <td> <a href="http://www.w3school.com.cn/cssref/pr_font_weight.asp" title="CSS font-weight 属性"> font-weight </a> </td> <td> 设置字体的粗细。 </td> </tr> </tbody> </table> >[danger]**作业:**练习常用的样式,文本颜色,左右对齐,上下对齐,修饰,文体大小,系列,加粗。