在网页中可以通过 u 标签 为文字添加下划线效果。

注意:应尽量避免使用 <u> 标签给文本加下划线,因为为文本加下划线会让浏览用户把它和超链接混淆。

HTML u 下划线标签语法

<u>www.w3run.com</u>

提示:u 是underline(下划线)的首字母。

HTML u 下划线标签定义

<u> 标签可定义下划线文本。也就是说,在<u>...</u>元素中的文本浏览器会把其加上下划线呈现给用户浏览。

提示:除了使用 u 标签实现下划线效果,还可以通过使用 CSS 中text-decoration:underline实现同样的效果。例如:<span style="text-decoration:underline">Underline</span>

HTML u 标签实例演示

<html>
<head>
<title>HTML 下划线u标签 </title>
</head>
<body>
w3教程网:<u>www.w3run.com</u>
<a href="http://www.w3run.com/">www.w3run.com</a>
</body>
</html>

运行效果如下图所示:

HTML下划线u标签

注意:从上面的实例中我们可以发现<u>标签和<a>标签定义的文本都会带有下划线,但是它们的使用意义不同。初学者不要将<u>(下划线)和<a>(超链接)标签混淆,应尽量少给文本加上下划线,用户会把它当作超链接而误点。

CSS去掉 HTML u 标签下划线

我们可以通过CSS去除<u>的下划线样式,代码如下:

<html>
<head>
<title>去除HTML u标签下划线样式 </title> 
</head>
<body>
<u style="text-decoration:none">www.w3run.com</u>
<u>www.w3run.com</u>
</body>
</html>

给所有 u 标签去除样式:

<html>
<head>
<title>去除所有HTML u标签下划线样式 </title>
<style>
u{text-decoration:none}
</style> 
</head>
<body>
w3教程网:<u>www.w3run.com</u>
<u>www.w3run.com</u>
</body>
</html>

拓展:text-decoration : none(无装饰) || blink(闪烁) || underline(下划线) || overline(上划线) || line-through(贯穿线,删除线)。