0

ギャラリー内の一連の画像の上にテキストを配置する必要があります。テキスト部分に関するチュートリアルをたくさん見つけましたが、画像をフロートさせる必要があります。float：leftを追加するたびに、トリックは機能しなくなります。私のコード（簡潔にするためにインラインのcss）：

<a href="/photos/photo1.php" title="photo1">
<span style="position: relative; width: 100%;">
  <img src="/photos/photo1.jpg" alt="" />
  <span style="position: absolute; top: 10px; left: 0; width: 100%;">Text over image</span>
</span>
</a>

<a href="/photos/photo2.php" title="photo2">
<span style="position: relative; width: 100%;">
  <img src="/photos/photo2.jpg" alt="" />
  <span style="position: absolute; top: 10px; left: 0; width: 100%;">Text over image</span>
</span>
</a>

このように画像は上下に並んでいますが、私が言ったように、他のすべてを壊さずにそれらを浮かせる必要があります。

4

1 に答える 1

2

アウター全体<span>または<a>. 私の推測では、現在、<img>具体的にフロートしようとしているため、要素が予期しない位置に配置されます。この仮定が正しくない場合は、詳細を更新することをお勧めします。

于 2010-04-05T15:22:53.593 に答える