CSS-text-decoration（文字修饰）

最新推荐文章于 2025-06-23 15:50:41 发布

佛佛ง

最新推荐文章于 2025-06-23 15:50:41 发布

阅读量920

点赞数

CC 4.0 BY-SA版权

分类专栏： CSS学习笔记

本文链接：https://blog.youkuaiyun.com/LzzMandy/article/details/86244294

CSS学习笔记专栏收录该内容

26 篇文章

订阅专栏

本文详细介绍了CSS中text-decoration属性的使用方法，包括line-through、overline和underline三种文本修饰效果，通过实例展示了如何为不同段落设置不同的文本装饰样式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

text-decoration属性

<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">标题</h1>
			<style type="text/css">
				p:nth-child(1) {
					text-decoration: line-through;
				}
				p:nth-child(2) {
					text-decoration: overline;
				}
				p:nth-child(3) {
					text-decoration: underline;
				}
			</style>
		</header>
		<div class="mui-content">
			<center>
				<p>第1个</p>
				<p>第2个</p>
				<p>第3个</p>
			</center>

		</div>
		<script src="js/mui.min.js">
			mui.init();
		</script>
	</body>
</html>