CSS: underline(下線)の「色」や「太さ」を指定する
CSS で underline の「色」や「太さ」を指定するには border-bottom プロパティを使用します。
通常、リンク部分のunderline(下線)は 「text-decoration: underline」となっています。
ですが、text-decoration プロパティでは「太さ」や「色」まではコントロールできないので、
「text-decoreation: none」と非表示にして、代わりに border-bottom プロパティで下線を表します。
underlineの色や太さを指定するサンプル
色が「darkblue」、太さが「3px」の underline は下のようになります。
a{
text-decoration: none;
border-bottom: 3px solid darkblue;
}
この方法なら、下線の「色」、「太さ」、「スタイル」をいろいろと自由に表現できます。
下は、色が「red」、太さが「2px」、スタイルが「点線」 の underline です。
a{
text-decoration: none;
border-bottom: 2px dotted red;
}