ホーム   »  スポンサー広告  »  スポンサーサイト  »  HTML   »  画像表示知識  »  画像に文字を挿入し、リンクを張る

スポンサーサイト

広告
  
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。


Yahoo!ブックマーク Googleブックマーク はてなブックマーク livedoorClip del.icio.us newsing FC2 Technorati ニフティクリップ iza Choix Flog Buzzurl 
ランキングはこちらをクリック!
▲ Page Top     

画像に文字を挿入し、リンクを張る

広告
  

画像に文字を挿入し、リンクを張る

cssでbackgroundを指定して、その背景画像にhtmlでリンクを張ることはできないようです。
しかし、「リンクしたい場所(あるいはリンクそのもの)に背景を指定する」ことは可能です。

「画像に文字を挿入し、リンクを張る」手順は下記のようにしてください。
CSSファイル
.top a { background:url(/top.gif); width:100px; height:50px; display:block; } 
/* 画像アドレスは正確に。display:block; で高さも固定できるようにする。画像のサイズに合わせて高さと幅を指定 */
.top span { visibility: hidden; } 
/* display:none; だと、firefoxなどのブラウザでリンク自体が表示されない*/


HTMLファイル
<p class="top">
<a href="top.html" title="リンク説明"><span>トップページ</span></a>
</p>
※alt属性はimg要素のみに使うものです。


関連記事
スポンサーサイト


Yahoo!ブックマーク Googleブックマーク はてなブックマーク livedoorClip del.icio.us newsing FC2 Technorati ニフティクリップ iza Choix Flog Buzzurl 
ランキングはこちらをクリック!
▲ Page Top     

Comment
Trackback
Trackback URL
Comment Form
管理者にだけ表示を許可する
サイト紹介

仕事で遭遇したトラブル対応をまとめたサイト。インフラエンジニア、サーバエンジニアとしてスキルアップするための情報(IT講座、Linux、Postfix、PostgreSQL、MySQL、Apache、Java、セキュリティ対策、おすすめ書籍)提供します。
全記事表示リンク
カテゴリ
スポンサーリンク

サーバエンジニアのための書籍
プロフィール

hotally

Author:hotally
仕事:インフラエンジニア
取得資格:第2種基本情報処理
     情報セキュリティスペシャリスト
     ネットワークスペシャリスト
     PostgreSQLCE シルバー

アクセスランキング
[ジャンルランキング]
コンピュータ
618位
アクセスランキングを見る>>

[サブジャンルランキング]
Webサービス
27位
アクセスランキングを見る>>
ブログ
最新記事
カテゴリークラウド
スポンサーリンク


RSSリンクの表示
リンク
ブロとも申請フォーム
QRコード
QR
Lc.ツリータグリスト
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。