プログラミング

text-decorationで線の位置・色・スタイルを指定【CSS】

text-decorationは文字に引く線の位置やスタイル、色などをまとめて指定できるプロパティです。

{text-decoration: -位置 -スタイル -色;}

指定できる値は「text-decoration-line」、「text-decoration-style」「text-decoration-color」の各プロパティと同じ。

値は半角スペースで区切って指定し、もし省略した場合は各プロパティの初期値が適用されます。

下記は2つとも同じ意味です。

.decoration {
 text-decoration-line: underline;
 text-decoration-style: double;
 text-decoration-color: red;
}
.decoration {
 text-decoration: underline double red;
}

それぞれのプロパティを別々に指定しなくても、text-decorationプロパティでまとめて指定した方が楽ですよね。

関連記事
text-decoration-lineで線の位置を指定【CSS】
text-decoration-styleで線のスタイルを指定【CSS】
text-decoration-colorで線の色を指定【CSS】

Leave a Comment