网页设计与制作教程Web前端开发（第7版）课件：CSS3的属性-CSS文本属性.pptx

本章介绍CSS设置背景、文本、列表、图像、表格、表单、链接等元素的属性样式。CSS3的属性CSS文本属性

目录CSS3的属性5.1CSS背景属性5.2CSS字体属性5.3CSS文本属性5.4CSS尺寸属性5.5CSS列表属性5.6CSS表格属性5.7CSS内容属性5.8CSS属性的应用5.9实训——制作社区网页面习题5

5.3CSS文本属性5.3.1文本颜色属性color语法：color:color示例代码如下。div{color:red;}/*颜色值为颜色名称*/div{color:#000000;}/*颜色值为十六进制值*/div{color:rgb(0,0,255);}/*颜色值为rgb函数值*/div{color:rgb(0%,0%,80%);}/*颜色值为rgb百分数*/

5.3CSS文本属性5.3.2文本方向属性direction语法：direction:ltr|rtl|inherit示例代码如下。div{direction:rtl;unicode-bidi:bidi-override;}

5.3CSS文本属性5.3.3字符间隔属性letter-spacing语法：letter-spacing:normal|length示例代码如下。div{letter-spacing:5px;}div{letter-spacing:0.5pt;}

5.3CSS文本属性5.3.4行高属性line-height语法：line-height:length|normal|inherit

5.3CSS文本属性5.3.5文本水平对齐方式属性text-align语法：text-align:left|right|center|justify示例代码如下。div{text-align:center;}

5.3CSS文本属性5.3.6为文本添加装饰属性text-decoration语法：text-decoration:none|underline|blink|overline|line-through示例代码如下。div{text-decoration:underline;}a{text-decoration:underlineoverline;}

5.3CSS文本属性5.3.7段落首行缩进属性text-indent语法：text-indent:length示例代码如下。div{text-indent:-5px;}div{text-indent:underline10%;}

5.3CSS文本属性5.3.8文本的阴影属性text-shadow语法：text-shadow:x_position_lengthength|y_position_length|blur|color示例代码如下。p{text-shadow:0px0px20pxyellow,0px0px10pxorange,red5px-5px;}p:first-letter{font-size:36px;color:red;text-shadow:red0px0px5px;}

5.3CSS文本属性5.3.9文本的大小写属性text-transform语法：text-transform:none|capitalize|uppercase|lowercase示例代码如下。div{text-transform:uppercase;}

5.3CSS文本属性5.3.10元素内部的空白属性white-space语法：white-space:normal|pre|nowrap示例代码如下。p{white-space:nowrap;}

5.3CSS文本属性5.3.11单词之间的间隔属性word-spacing语法：word-spacing:normal|length示例代码如下。div{word-spacing:10;}div{word-spacing:10px;}

5.3CSS文本属性5.3.12文本的截断效果属性text-overflow语法：text-overflow:clip|ellipsis示例代码如下。div{text-overflow:clip;white-space:nowrap;overflow:hidden;}

5.3