1、主要属性
text-decoration属性用于设置或改变文本的装饰效果,它可以让文本更加突出,改变文本的显示效果。
用法:text-decoration: 属性值;
属性值:
none:无装饰
underline:文本下划线
overline:文本上划线
line-through:文本中划线
blink:文本闪烁
2、示例:
<p style=”text-decoration: underline;”>这是一段文本,文本下面有条下划线</p>
<p style=”text-decoration: overline;”>这是一段文本,文本上面有条上划线</p>
<p style=”text-decoration: line-through;”>这是一段文本,文本中间有条中划线</p>
<p style=”text-decoration: blink;”>这是一段文本,文本会闪烁</p>
3、完整代码示例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
h1 {
text-decoration: overline;
}
h2 {
text-decoration: line-through;
}
h3 {
text-decoration: underline;
}
</style>
</head>
<body>
<div style="width: 700px;margin-left: 100px;margin-top: 50px;">
<p>没有下划线的链接:<a href="https://www.itshiye.com">www.itshiye.com</a></p>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
</div>
</body>
</html>
4、效果图
正文完