第三章 CSS设置文本格式.docVIP

第章? 长度单位可以使用2.2节讲解“设置字体”时介绍的所有单位。 实例1.html。 html head title应用letter-spacing属性/title style type=text/css !-- .h{font-family:黑体;font-size:20pt;font-weight:bold;letter-spacing:normal} .p1{font-family:宋体;font-size:18px;letter-spacing:5px} .p2{font-family:宋体;font-size:18px;letter-spacing:15px} -- /style /head body center h2 class=h设置字符间距/h2 /center hr p class=p1这段文字的字符间距为5像素/p p class=p2这段文字的字符间距为15像素/p /body /html 定义标题样式类h字符间距为正常，定义段落的样式类p1字符间距为5像素，定义标题样式类p2字符间距为15像素。 网页效果如图3-1。 图3-1设置字符间距 2 调整单词间距word-spacing 单词间距主要用来设置单词之间的空格距离。 基本语法： word-spacing:normal|长度 语法说明： normal表示间距正常显示，是默认设置。 长度包括长度值和长度单位，长度值可以使用负数。 长度单位可以使用2.2节讲解“设置字体”时介绍的所有单位。 实例2.html。 html head title应用word-spacing属性/title style type=text/css !-- .h{font-family:黑体;font-size:20pt;font-weight:bold} .p1{font-family:Time New Roman;font-size:18px;word-spacing:normal} .p2{font-family:Time New Roman;font-size:18px;word-spacing:10px} -- /style /head body center h2 class=h设置单词间距/h2 /center hr p class=p1this is a good book,many people like.……单词间距为正常显示/p p class=p2this is a good book,many people like.……单词间距为10像素/p /body /html 网页效果如图3-2。 图3-2 设置单词间距 3 添加文字修饰text-decoration text-decoration对文字添加一些常用的修饰，设置下划线和删除线等。 基本语法： text-decoration: underline|oveline|line-through|blink|none 语法说明： 表3-1 text-decoration属性取值说明 属性的取值 描述 underline 给文字添加下划线 overline 给文字添加上划线 line-through 给文字添加删除线 blink 添加文字闪烁效果 none 没有文本修饰，是默认值 实例3.html。 html head title应用text-decoration属性/title style type=text/css !-- h2{font-family:黑体;font-size:20pt;font-weight:bold} .p1{font-size:18px;text-decoration:underline} .p2{font-size:18px;text-decoration:line-through} .p3{font-size:18px;text-decoration:overline} -- /style /head body center h2添加文字修饰/h2 /center hr p class=p1这段文字为添加下划线的效果/p p class=p2这段文字为添加删除线的效果/p p class=p3这段文字为添加上划线的效果/p /body /html 网页效果如图3-3。 图3-3添加文字修饰 4 设置文本排列方式text-align text-align属性用来控制文本的排列和对齐方式。 基本语法： text-align:left|right|center|justify 语法说