CSSに取り消し線を追加するにはどうすればよいですか? css text-decoration 属性は取り消し線を設定します (コード例)-CSSチュートリアル-php.cn

CSSに取り消し線を追加するにはどうすればよいですか? css text-decoration 属性は取り消し線を設定します (コード例)

青灯夜游

リリース： 2018-10-09 14:21:40

オリジナル

23018 人が閲覧しました

CSS に取り消し線を追加するにはどうすればよいですか?前回の記事では [html文字に取り消し線を付けるには？取り消し線を付ける2つの方法（例）】 htmlタグに取り消し線を付ける2つの方法を紹介しましたが、この章ではcss text-decoration属性を使ってテキストに取り消し線を付ける方法を紹介します。取り消し線の効果、CSSを使用して取り消し線のスタイルを設定する方法。困っている友人は参考にしていただければ幸いです。

まず、CSS の text-decoration 属性について簡単に説明します。

text-decoration 属性は、テキストに追加する装飾を指定します。

説明:

この属性を使用すると、取り消し線の追加など、テキストに特定の効果を設定できます。子孫要素に独自の装飾がない場合、祖先要素に設定された装飾は子孫要素にも「拡張」されます。ユーザーエージェントはまばたきをサポートする必要はありません。

それでは、cssのtext-decoration属性を使ってテキストの取り消し線効果を追加する方法を、以下では簡単なコード例を通してcssの取り消し線の実装方法を詳しく解説していきます！

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>css添加文本文字的删除线</title>
		<style>
			p{
				text-decoration:line-through;
			}
		</style>
	</head>
	<body>
		<p>这里有一条删除线</p>
	</body>
</html>

ログイン後にコピー

レンダリング:

CSSに取り消し線を追加するにはどうすればよいですか? css text-decoration 属性は取り消し線を設定します (コード例)

説明:

line-through 属性値: テキストの下を通過する線を定義します。

例からもわかるように、text-decoration:line-through; を設定して、

タグ内の文字列に取り消し線を追加する方法が簡単で便利です。また、CSS 設定を通じて取り消し線のスタイルを簡単に変更できます。色、例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>css添加文本文字的删除线</title>
		<style>
			p{
				text-decoration:line-through;
				color: red;
			}
			span{
				color: black;
			}
		</style>
	</head>
	<body>
		<p><span>这里有一条删除线</span></p>
	</body>
</html>

ログイン後にコピー

レンダリング:

CSSに取り消し線を追加するにはどうすればよいですか? css text-decoration 属性は取り消し線を設定します (コード例)