|
リンク 下線を消すには
|
|
|
|
<a href=
"リンク先URL"
style="text-decoration: none"
>
リンク先タイトル
</a>
|
|
リンク設定で、テキストでリンク先を指定した時、文字列に下線が表示され
気になる場合がある。 その文字列下線をどのようにして消すの?。
本来、ページ全体の文字列の下線を消す設定はスタイルで記述するのですが、HTMLでも個別のリンクに指定出来ます。
|
|
|
個別リンクテキスト下線を消すには、スタイルで指定します。
スタイルの、
style="text-decoration: none"
を、リンクに記述します。
|
|
|
画像と文字列で指定したリンク表示
実際の
URL
yahoo
で検索
にリンクした表示抜粋画面です。クリックしてみて下さい。
|
|
|
|
|
|
下線を消す HTMLタグ 参考例1
上記タグに画像サイズ・高さ・幅・画像代替表示文字列を指定
実際のyahoo
にリンクしている画像の枠・下線を消した画像と文字列で指定したリンク表示タグです。
<a href=" http://www.yahoo.co.jp/" style="text-decoration: none">
<img src="recip_sm.gif" alt="yahooで検索" border="0">yahooで検索</a>
|
|
|
|
|
(注)
下線が表示されていない場合、リンク先を指示しないとテキスト文字列表示との判別が困難で見過ごされ易いので、指示しなくても
リンク先と判別出来る場合のみに、下線を消す指定をしよう。
(補)
ページ全体の、リンクテキスト下線を消す講座は、未アップ(近々)、スタイルの講座で記述予定。
|
<a href="
リンクURL
style="text-decoration: none">
リンク説明文
</a>
|
|
|
|
下線を消す HTMLタグ 参考例2
実際の
yahooの、
テキスト下線を消したリンクタグと表示見本です。
|
<a href=" http://www.yahoo.co.jp/"
style="text-decoration: none"
>yahoo
で検索
></a>
|
|
|
yahoo
で検索
←リンクテキスト下線を消して
yahoo
のWebサイトにリンクしています。
|
|
|
|
リンク設定の、HTMLタグの説明
|
<a>
|
a
は、リンクを貼るリンクの要素
|
|
<a href="
A
">
|
A
は、ページのURL(場所)ページファイル名
|
|
href
|
はハイパーリンク先のhtmlファイルまたはURL
|
|
http://
|
url
の場所の指定はこのhtmlタグの後に続ける
|
|
</a>
|
終了タグ 設定しないと複数のリンク先が干渉しあって正確に
リンク先に飛ばないので必ず終了タグで締める事。
|
|
style="text-decoration: none"
|
リンク説明文の下線を消す。
|
|
|
|
|
|
|
|