text-decoration这是CSS中对文字修饰的一个属性，我们可以通过这个属性来设置文字的下划线，上划线，删除线和控制闪烁文字。希望我今天的分享能够帮助在CSS学习中的各位同胞。工具/原料moreCSS基础知识HTML基础知识方法/步骤1/5分步阅读

首先我们来看看默认的文字显示的样式，这里使用text-decoration：none；来实现。具体代码如下，具体代码如下：

html

head

titletext-decoration属性/title

/head

body

p style=text-decoration:none;文字字体测试下划线/p

/body

/html

如下图可以看到初始的效果图。

2/5

在很多时候可能看到带有下划线的文字？在HTML中也可以实现，这里用CSS的属性text-decoration:underline;来实现，具体代码如下：

html

head

titletext-decoration属性/title

/head

body

p style=text-decoration:none;默认格式文字/p

p style=text-decoration:underline;文字字体测试下划线/p

/body

/html

可以看到第二行文字有下划线显示。

3/5

上面我们实现了下划线，我们能不能实现删除线操作呢？答案肯定是可以的，这里我就来演示删除线实现的过程，具体代码如下：

html

head

titletext-decoration属性/title

/head

body

p style=text-decoration:none;默认格式文字/p

p style=text-decoration:underline;文字字体测试下划线/p

p style=text-decoration:line-through;文字字体测试删除线/p

/body

/html

第三行的删除线是不是在很多网站中遇到，我们自己网站需要这个功能就用删除线来完成。

4/5

有了删除线和下划线，CSS还给我们提供了一个叫上划线的功能。这里我就废话不多说，看代码就能理解。

html

head

titletext-decoration属性/title

/head

body

p style=text-decoration:none;默认格式文字/p

p style=text-decoration:underline;文字字体测试下划线/p

p style=text-decoration:line-through;文字字体测试删除线/p

p style=text-decoration:overline;文字字体测试上除线/p

/body

/html

开最下面显示的文本是不是将文字有上划线这个功能了。

5/5

text-decoration这个属性还给我提供了一个值叫blink，可以定义闪烁的文本。我们来看看具体的效果吧，代码如下：

html

head

titletext-decoration属性/title

/head

body

p style=text-decoration:none;默认格式文字/p

p style=text-decoration:underline;文字字体测试下划线/p

p style=text-decoration:line-through;文字字体测试删除线/p

p style=text-decoration:overline;文字字体测试上除线/p

p style=text-decoration:blink;文字字体测试闪烁文本/p

/body

/html

注意后面这个闪烁文本有的浏览器不支持，使用的比较少。

注意事项

CSS具有很多属性我们在学习中要总结

多学习练习才能在程序设计中做的更好。

CSSCSS下划线CSS删除线CSS上划线CSS闪烁文本