文本在圖像中的文字在IE中的問題

Question

我只是簡單的文字放在IE中的圖像上有一些麻煩。圖像的z-index比文本低，所以我不確定它會是什麼。我也試圖給文本一個相對的位置而不是絕對的位置。但它仍然無法正常工作。有任何人請任何想法？

由於

Answer 1

<img src="myimage.jpg" title="Text over image here"> 

Answer 2

IE不處理的z-index爲標準狀態。最好的解決方案是將圖像作爲背景圖像屬性放入容器（例如div）以及該div內的文本。這樣所有瀏覽器都能識別正確的順序。

第二種解決方案是將兩個IMG和跨度（包含文本）的一個div具有以下屬性：

<div style="position:relative"> 
    <img src="a.jpg" style="position:absolute;" /> 
    <span style="position:absolute">your text here</span> 
</div> 

Answer 3

把圖像和文本中設置爲一個div容器「相對」位置。 設置圖像的位置'絕對' 文本將出現在圖像的頂部

要控制文本把它放在另一個div並使用margin屬性來移動它。

<div id="container" style="position: relative;"> 
    <img style="position: absolute;" src="#" /> 
    <div id="textcontainer" style="margin: 10px 10px 10px 10px"> 
      Text to float on image here 
    </div> 
</div> 

不需要z-index :)不同版本的IE不喜歡它。