浮動圖片上的文字

Question

我需要在畫廊中的一系列圖片上放置一些文字。我發現很多關於文本部分的教程，但是圖像需要浮動。 每當我添加浮動：儘管該技巧不再有效。我的代碼（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> 

這樣的圖像是一個在另一個但就像我說我需要把它們飄浮在不破壞一切。

Answer 1

你會想漂浮整個外部<span>或<a>。我的猜測是，你目前正試圖漂浮<img>，這導致元素最終在意想不到的位置。如果此假設不正確，則可能需要更新更多詳細信息。