4 
<div class="r1">
    <a href="http://..."><img src="..." />
        <div class="text1">TEXT</div>
    </a>
</div>

これは私が使用しているマークアップです。私が抱えている問題は、DIV (ボックス全体) がハイパーリンクになっていることです。画像をハイパーリンクするだけです。私が使用している画像は、円の中の三角形に似ているため、ボックス化された div が重複しています。

テキスト部分はdivにあります[私は初心者であり、それ以来、そのように配置するために作成されたため]、また、単語が、たとえば画像のように三角形の内側に収まるように44度の角度などの角度になっているためです。

4

6 に答える 6

3

aタグ内に内部 div 全体があるため、div はハイパーリンクに反応しています。タグ</a>の最後でシフトしてみてください。<img>このようなもの：

<div class="r1">
    <a href="http://..."><img src="..." /></a>
    <div class="text1">
         TEXT
    </div>
</div>

あなたのコメントに基づいて、画像とテキストの両方にハイパーリンクを設定したいようです。もしそうなら、あなたがしていることはまったく問題ありません。外側の div 全体をクリックしたように視覚的に見えるかもしれませんが、外側の div をクリックしたのではなく、実際にはその中のコンテンツをクリックしました。これは、外側の div 内に他に何もないためです。

于 2012-07-11T05:31:12.353 に答える
2

これを試して

<div class="r1">
    <a href="http://..."><img src="..." /></a>
        <div class="text1">
            TEXT
        </div>
</div>
于 2012-07-11T05:32:13.880 に答える
2

構文が間違っていました。これを試してください......。

  <div class="r1">
  <a href="http://..."><img src="..." /></a>
  <div class="text1">
        TEXT
  </div>
  </div>
于 2012-07-11T05:33:25.177 に答える
1

これを試して：

<div class="r1">
<a href="http://..."><img src="..." /></a>
<div class="text1">
TEXT
</div>
</div>
于 2012-07-11T05:36:33.710 に答える
0

このコードを試してください。

<div class="r1">
  <div>   
     <a href="http://..."><img src="..." /></a>
  </div>
  <div class="text1">
    TEXT
  </div>
</div>
于 2012-07-11T05:34:30.790 に答える
0

ねえ、このようにこれに慣れました

HTML

<div class="r1">
    <a href="http://..."><img src="..." /></a>
    <div class="text1">
         TEXT
    </div>
</div>

そして今、CSSはこれに慣れています

.r1 > a{
display:inline-block;
}

.r1 > a, .r1 > a img{
vertical-align:top;
}
于 2012-07-11T05:44:23.190 に答える