ブログを運用するためのコツ・HTML・CSS・javascriptのテクニックを紹介するブログ

ブログ研究室

css

CSS text-decorationで下線を引く方法

cssで下線を引きたい!という事は多々あるはず。ここでは、様々な下線の引き方をスピーディーにご紹介します!

text-decorationはこうなります

では、まず、CSSでの書き方から。一番シンプルなのかこちらです↓

text-decoration : underline;

これを書くと・・・こうなります⇒下線ひいてみました

text-decorationの書き方

こんな感じに書いてあります

<p>これを書くと・・・こうなります⇒<span style="text-decoration:underline; font-size:24px;">下線ひいてみました</span></p>

文章の一部分だけに下線引きたい時はどうしたらいいの?と疑問に思われる方。

そんな時は、<span style="text-decoration:underline;">~</span>で下線を引きたい部分を囲ってくださいね。

text-decorationはこんな時に使えます

リンク部分にマウスを当てたら下線が出るようにする方法

-css

Copyright© ブログ研究室 , 2020 All Rights Reserved.