html让text变成线,text-decoration属性(CSS设置文本的修饰线外观)

text-decoration属性

在CSS中，使用text-decoration属性，可以在文本上方、下方、或中间添加装饰线，可选值为none|underline|overline|line-through|blink，默认值为none。none无装饰，underline下划线，overline上划线，line-through文字中间贯穿线，blink闪烁。装饰线的颜色与文本的颜色相同。

默认情况下，文本都是没有装饰线的，但超链接是个例外，它默认就带有下划线。当然，可以把text-decoration属性的值设置为none，去掉超链接的下划线，当鼠标悬停后，再添加下划线，来提醒用户当前文本为链接文本。如：

a{

text-decoration:none;

}

a:hover{

text-decoration:underline;

}

文本装饰线的另一个常见用法，就是修订文本，在被删除文本上增加删除线。还有团购网站，在原价上增加删除线，做删除状。其实，还可以使用text-decoration属性，为文本同时添加多条装饰线。如：

p{

text-decoration:underlineoverlineline-through;

}

CSS设置文本的修饰线外观

color特点：设置文本文字色彩。用法如下：

color：色彩值;

color特点能够设置的合法色彩值包括：16进制色彩值(例：#ffffff)，rgb色彩值【例：rgb(0,0,0)】，rgba色彩值【例：rgb(0,0,0,0.5)，0.5表明透明度】，hsl色彩值【例：hsl(120,65%,75%)】，hsla色彩值【hsl(120,65%,75%,0.3)，0.3表明透明度】。

2、css文本文字行高(行距离)的特点

line-height特点：设置行间的间隔(行高)。用法如下：

line-height：值;

具体cssline-height特点是怎么设置文本文字的行距离，我们能够参阅之前的文章【css怎么设置行距离？css文本文字的行距离设置】，希望对我们有所帮助。

3、css设置文本文字的水平对齐办法的特点

text-align特点：设置元素中的文本文字的水平对齐办法。用法如下：

text-align:left||right||center||justify;

left：设置文本文字左对齐。默认值：由浏览器决议。

right：设置文本文字右对齐。

center：设置文本文字居中对齐。

justify：完成两端对齐文本作用。

4、css文本缩进特点

text-indent特点：设置文本缩进。

具体csstext-indent特点是怎样设置文本缩进的，我们能够参阅【css怎么完成首行缩进作用？text-indent特点完成首行缩进】。

5、设置文本文字装饰作用

text-decoration特点：界说添加到文本的润饰。

阐明：

这个特点允许对文本设置某种作用，如加下划线。如果子孙元素没有自己的装饰，先人元素上设置的装饰会“延伸”到子孙元素中。

用法：

text-indent：none||[underline(下划线)||overline(上划线)||line-through(中划线)]||blink;

none：默认值，界说规范的文本。

underline：界说文本下的一条线。

overline：界说文本上的一条线。

line-through：界说穿过文本下的一条线。

blink：界说闪耀的文本。

6、文本字符的大小写转换特点

text-transform特点：控制文本字符的大小写。

用法：

text-transform:uppercase(全大写)||lowercase(全小写)||capitalize(首字母大写)||none;

我们能够参阅文章【css怎么设置字母的大小写？text-transform特点设置字母的大小写】，里面有具体介绍。

7、文本文字距离的特点

word-spacing特点：设置文字或单词之间的距离，单词之间的距离=word-spacing+空格大小。

letter-spacing特点：设置字母间的间隔。

我们能够参阅文章【css怎么设置文字距离？word-spacing特点与letter-spacing特点的简单比较】，里面介绍了word-spacing特点和letter-spacing特点设置文本文字的距离的办法，以及它们的区别。

8、文本文字暗影的特点

text-shadow特点：向文本文字设置暗影