今回は、aタグの下線を消すtext-decorationの使い方をご紹介します。
aタグの下線を消すtext-decorationの使い方
aタグのテキストの下線を消すには、
『text-decoration: none;』と記載します。
また、text-decorationを使うと、テキストに対して様々な線を引くことができます。
線の種類に関しては、以下のデモをご覧ください。
See the Pen qBZMXeO by ryu (@ryu-no-sss) on CodePen.
以下、text-decorationの種類の表です。
| none | 下線を削除 |
| underline | テキストに下線を引く |
| overline | テキストに上線を引く |
| line-through | 取り消し線を引く |
| underline+dotted | ドットの線を引く |
| underline+wavy | 波線 |
dottedやwavyは、underlineだけでなく、
overlineやline-throughなどと組み合わせることができます。
また、線に色をつけたい場合は、以下のデモのように記載しましょう。
See the Pen MWyqEJM by ryu (@ryu-no-sss) on CodePen.
まとめ
・aタグの下線を消す場合は、『text-decoration: none;』と記載する。
今回は、aタグの下線を消すtext-decorationの使い方をご紹介しました。
他にも、aタグに対してよく使うCSSコードを以下のリンクの記事にまとめているので、ぜひ！
それでは、最後まで読んでいただきありがとうございました。
タグ
