• ベストアンサー

背景にリンク?

partitaの回答

  • partita
  • ベストアンサー率29% (125/427)
回答No.2

イメージマップを使用することはできないんですよね。 意図する構想とは異なるかもしれませんが、下記のような方法もあります。 <div> <p><a href="index.html">リンク</a><p> <div> ・divに背景画像を適用 ・スタイルで、pを横60px、縦20pxとする ・スタイルで、aをdisplay:block、サイズはpと同じにする。text-indexntを-9999pxに設定(画面外に飛ばす)。 ここまでで、あたかもdivは空っぽで、背景画像のみが表示されているように見えます。しかし、マウスを当てると反応する部分が存在しています。 あとは、pにpaddingやmarginを設定して位置を背景画像に合わせれば、あたかも背景画像にリンクが貼り付けられているように見えます。ただし、イメージマップと異なり、円形リンクなどはできません。 サイズ調整はご自分で試してください。 divにサイズ設定することも必要かもしれません。

関連するQ&A

  • 背景画像をリンクにする?

    タイトルの通りなのですが、よくブログなどにある、headerの部分を画像にしてtopへのリンクを張る方法が分かりません。 例えば森永卓郎さんのブログだと、タイトルの「つながるモリタクBLOG」の部分にリンクが張ってあり ブログのトップページに移動するようになっていますが、このクリックできる範囲を広げて、 緑色の背景画像の部分をクリックしても同じく移動できるように指定することはできませんでしょうか? 単に画像にリンクを張るだけならできますが、背景にしてみたところ詰まってしまいました…。 よろしくお願いいたします。

    • ベストアンサー
    • CSS
  • 固定背景画像にリンクをはりたいです。

    固定背景画像にリンクをはりたいです。 今、HPの隠しページを作っています。 右下固定の背景画像にリンクをはりたくて 透明の別画像を用意したんですが、 その画像を固定させる方法(HTMLタグ)が分かりません。 ピクセルなどではなく、右下に固定させたいです。

  • 画像リンクの背景色を1つ1つ指定する。

    画像にリンクを張り、その画像に触れたときに、画像の透過されている部分の背景色が変わるようにしたいのですがタグがわかりません。 前に一度やったことがあるのですが、そのときのソースを消してしまってわからなくなっているので困ってます。 <a href="xxx.html" style="a:hover background:#ff0000"><img src="xxx.gif" border="0"></a> ↑こんな感じだったようなきがします。(あまり記憶にさだかではないのですが。) 全体的にリンクの背景色をしていするスタイルシートはわかるので、そうではなくページ内にあるリンク一つ一つの背景色を指定する方法が知りたいです。よろしくおねがいします。

    • ベストアンサー
    • HTML
  • 背景画像にリンク

    背景に画像を固定して表示したページに、リンクを貼りたいのです。 フレームページで縦に2分割、左のページにスタイルシートで背景固定、BODYタグ内には何もなし、右のページも同じくスタイルシートで背景固定、こちらに左のページの背景画像内にある文字からリンクを貼り、そのリンクをはったページを右ページ内に反映させたいのです。 一枚の大きな画像を2分割して左と右のページでそれぞれ固定しているので、IMGタグはなるべく使いたくありません。 (IMGタグでスタイルシートでの背景固定ように、right bottomと出来るのならば全く問題ないので、その場合は教えてください^^;)

  • JavaScriptでリンクの背景にある画像をOnMouseOver時

    JavaScriptでリンクの背景にある画像をOnMouseOver時に変更する方法がわからなくて困っています。 webページを作っているのですが、OKWaveのサイトの上のタブのように画像を背景とするリンク上にマーカーが来たときにその画像の下部50%を表示するようにしたいのですがうまくいきません。 マーカーがリンク上に無い時には画像の上部50%を表示するようなものにしたいと思っています。 スタイルシートでリンクに指定したidなどで処理したいと思っています。 説明が下手かと思いますが、サンプルコード等を教えてください。

  • FLASHの背景色について

    HTMLで背景に画像を使って、その上にFLASHを重ねています。 IEで確認すると、FLASH部分の背景が透過になっていてちゃんと下の背景が見えます。 しかし、ネスケで見るとFLASHの領域部分が作成時の背景色になり、背景画像が見えなくなり、ショボイHPになってしまします。 これを回避する方法を教えてください!お願いします

  • GoLive4.0J画像にリンク,なのに背景にもリンク反応....

    GoLiveを使用しています。 さっき小さな画像にリンクを付けました。しかし画像のない、何もない背景をクリックしてもそのリンクに飛んでしまうんです。 プレビューでもアップロードして実際にブラウザで見ても、 何もない所にリンクが反応しています。 この前やっていた時はそんな事は全くなかったのです。

    • ベストアンサー
    • Mac
  • テーブルの背景画像にリンクを設定したい

    ナビゲーションボタンを配置するのに、テーブルで、 tdの背景画像として同じ画像を設定しました。 メニューはテキストで記述しました。 そのテキスト部分ではなく、背景画像にリンクを 設定したいのですが、できますでしょうか。 テキストは左寄せで短いものもあるので、 テキストリンでは、ボタンの右の方をクリックしても リンクせず、使い勝手が悪いかと思いまして・・。 文字も込みの画像でボタンを作るとどうも鮮明でない ような気がしたので、このようなやり方にしようかな と考えたのですが、何かいいアドバイスありましたら よろしくお願いします。

    • ベストアンサー
    • HTML
  • html リンク文字の背景色について

    <style type="text/css"> <!-- a:link { background-color :#000000; } --> </style> こんな感じでリンク文字に背景色をつけているのですが、 その背景色の縦幅・横幅はどうやったら指定できますでしょうか。 教えてください。

  • リンク先の背景色について

    a:hoverは一つのhtmlに一つずつしか指定できないのでしょうか? ヘッダーは背景色を変えて、フッターは下線がでるようにしたいんですけど可能ですか? もし可能であれば、方法を教えて欲しいです。 cssで下線を指定しているんですけど、全てのリンクで下線がでてしまいます。

    • ベストアンサー
    • HTML