DIV CSS如何给文字字体添加下划线？_Div+Css教程--HTML5中文学习网

使用css div如何给文字添加下划线样式呢？使用css对文字字体添加下划线样式方法教程。

对字体文字加下划线样式，有两种方法，一直直接使用html下划线标签，另外一种是使用CSS下划线样式。

接下来为大家介绍对文字字体实现下划线方法教程，通过案例方式让大家作为两种对文字加下划线样式。

一、html标签实现下划线

在html标签中对需要加下划线的文字加<u></u>即可实现加下划线样式。

1、标签语法：

<u>我被加下划线了</u>

2、html实例源代码

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>html下划线标签实例 www.divcss5.com</title> 
</head> 
<body> 
我是divcss5!<br />  
divcss5是网址<u>www.divcss5.com</u> !  
</body> 
</html>

二、css样式实现下划线样式

使用CSS样式单词：text-decoration:underline

1、语法

div{text-decoration:underline} 
/* css注释说明：这样的表达将让DIV标签内文字字体加上下划线 */

2、div css实现下划线实例代码

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>下划线 删除线 上划线实例 www.divcss5.com</title> 
<style> 
.divcss5{text-decoration:underline} /* underline下划线 */ 
.divcss5_1{text-decoration:line-through} /* line-through删除线贯穿线 */ 
.divcss5_2{text-decoration:overline} /* overline上划线 */ 
</style> 
</head> 
 
<body> 
<div class="divcss5">我被加下划线</div>  
<div class="divcss5_1">我被加贯穿删除线</div>  
<div class="divcss5_2">我被加上划线</div>  
</body> 
</html>