-1

私が基本的に探しているのは、特定の場所にある画像の上にテキスト、この場合はリンクを配置する方法であり、座標が望ましいです。usemap を介して画像にリンクを配置する方法があることは知っていますが、私の知る限り、リンクを長方形や円などの形にすることしかできません。

私は方法を探しましたが、これまでのところ不足しています。少し助けてくれる人がいることを願っています。

4

4 に答える 4

2
<div style="position:relative">
    <img src="http://www.example.com/blahblah.jpg">
    <a style="position:absolute; left:0px; top:0px;" herf="http://www.example.com">Some link</a>
</div>

要素にリンクを含めて、リンク要素にpositionofを指定し、 、、、および/またはを設定する必要があります。relativepositionabsolutelefttopbottomright

于 2013-05-09T14:28:19.560 に答える
1

画像を (css クラスまたはスタイル属性を使用して)<div>または他のブロック レベル要素の背景として使用し、その上にテキストを配置することができますが、うまくいきませんか? たぶんposition、div 内のテキストを微調整するために使用します。

于 2013-05-09T14:22:04.237 に答える
1

これを実現するには、次のようなマークアップを使用します。

<div class="container">

    <img src="image.jpg">

    <span class="some-text">Some Text</span>

</div>

それを次の CSS と組み合わせます。

div.container {
    position: relative;
}

span.some-text {
    position: absolute;
    bottom: 0;
    left: 0;
}

この例では、position: absolute;テキストを含むスパンは画像の左下に配置されているように見えます (ただし、実際には、画像の親コンテナー ( ) の左下にありますposition: relative;)。必要に応じてこれらの位置の値を変更します (例: top: 5%;right: 25px;など)。

background-image前の回答が示唆したように、イメージをコンテナ要素のとして設定することもできます。どちらのソリューションも機能します。ただし、そのソリューションを使用した場合は、親<div>コンテナーの寸法を定義する必要があります。<img>私の答え<div>はこれを必要と<div>しません<img>.

于 2013-05-09T14:27:36.807 に答える
0

これが役立つかどうかはわかりませんが、HTML CSS java と asp に関する情報を含む Web サイトがあり、さらにいくつかの言語の Web サイトがあります。

http://www.w3schools.comこれがお役に立てば幸いです

于 2013-05-09T14:49:48.703 に答える