在IE7文本旁邊顯示圖像

以下腳本顯示某些文本旁邊的圖像。它不適用於IE7。它應該如何修改？由於在IE7文本旁邊顯示圖像

<style type="text/css"> 

    div {width:200px} 
    div span { 
     padding: 0 5px 0 30px; 
     background-image: url("bg.gif"); 
     background-position:center; 
     background-repeat: no-repeat; 
    } 

</style> 


<body> 
    <div>Text 1<span></span></div> 
    <div>Text 2<span></span></div> 
    <div>Text 3<span></span></div> 
</body>

來源

2012-11-24 user1032531

您是否在html頁面中指定了doctype？例如：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd">

來源

2012-11-24 13:35:44 user1849494

是的，嘗試過，但仍然是一樣的。 – user1032531

也許IE不喜歡空的跨度，試試這個：' ' – user1849494

不，IE不喜歡空的跨度！你想爲未來的觀衆更新你的答案嗎？無論如何，你是對的。謝謝 – user1032531

div, div > span{ 
    display:inline; 
    float:left; 
}

我提供了根據您的問題，瀏覽器的問題和HTML腳本的小一點。我建議將此代碼放在HTML IE7條件中：

<!--[if IE7]--> 
    <!-- your CSS here --> 
<!--[endif]-->

這將刪除所有瀏覽器的CSS。

來源

2012-11-24 13:20:58 sourRaspberri

謝謝Beneto。 IE7顯示文字下的圖像，所有其他瀏覽器甚至不顯示圖像。 – user1032531

哦，好的，上面的代碼會顯示ie7文本旁邊的圖片。你上面說過使用查詢插入元素？你怎麼這樣做，因爲這可能是問題所在？ – sourRaspberri

看起來我不應該使用背景圖像。

<style type="text/css"> 
    div img.image { 
     padding-left: 15px; 
    } 

</style> 


<body> 
    <div><span>Text 1</span><img class="image" src="bg.gif" /></div> 
    <div><span>Text 2</span><img class="image" src="bg.gif" /></div> 
    <div><span>Text 3</span><img class="image" src="bg.gif" /></div> 
</body>

來源

2012-11-24 13:35:08 user1032531

其實這並不符合我的需求。 span是由jQuery插件插入的，我不能（不想）只是將它們更改爲圖像。 – user1032531

在IE7文本旁邊顯示圖像

回答

相關問題