• ベストアンサー

リンクの文字と下線の間にスペースを持たせたい

ホームページを制作する際のリンク設定について教えてください。 文字とリンク下線の間を少し空けるには、「text-decoration:underline」以外にどのような記述が必要なのでしょうか？

質問者が選んだベストアンサー

  • ベストアンサー
回答No.3

アンダーラインの間隔を調整するプロパティはありませんが、 やりたいことは下記ような感じでしょうか。 -------------- <html> <head> <style> a { color: #0033cc; text-decoration: none; border-bottom: solid 1px #0033cc; padding-bottom: 0px; /* ←ここの値を変更して文字との間隔を調整 */ } </style> </head> <body> <a href="http://oshiete.goo.ne.jp/">あいうえお</a> </body> -------------- ※IEは後方互換モードでしか駄目みたいですが。

panda919
質問者

お礼

アンダーラインの間隔を調整するプロパティはないのですね。残念…。 でもいただいた例でやってみたら確かに下線の位置が変わりました。 ありがとうございます。

すると、全ての回答が全文表示されます。

その他の回答 (2)

noname#79554
noname#79554
回答No.2

a{text-decoration:none;border-bottom:double #ff0000 4px;padding-bottom:0.2em;} としてみてください。 リンク設定された文字の、約５分の一幅下に赤い二重線が引かれると思うんですが。

panda919
質問者

お礼

ありがとうございます。 確かに赤い下線が引かれました！

すると、全ての回答が全文表示されます。
noname#136435
noname#136435
回答No.1

下記URLは参考になりませんか http://www.tagindex.com/stylesheet/text_font/text_underline_position.html

panda919
質問者

お礼

有難うございます。 いただいたURLを確認いたしましたが、上下左右に下線（？）の位置を変更できるようですが、文字との間隔を調整することは出来ないようでした。

すると、全ての回答が全文表示されます。
  1. カテゴリ
  2. パソコン・スマートフォン
  3. ソフトウェア
  4. ホームページ作成ソフト

関連するQ&A

注目のQ&A

カテゴリ

OKWAVE コラム

あなたにピッタリな商品が見つかる！ OKWAVE セレクト

専門家に質問してみよう

職業から探して質問する
質問する