避免img之間的空格

如何避免img標籤之間的空格？避免img之間的空格

在打印屏幕上的內容被標記

enter image description here

代碼：

#menu > img { 
    margin:0px; 
    padding:0px; 
} 

<div id="menu"> 
    <img src="/gfx/menu.home.png" /> 
    <img src="/gfx/menu.functions.png" /> 
    <img src="/gfx/menu.prices.png" /> 
</div>

來源

2012-02-11 clarkk

如何刪除填充和邊距？ – IamStalker 2012-02-11 22:41:45

你是什麼意思？已更新我的問題 – clarkk 2012-02-11 22:45:35

你可以把它放在http://jsfiddle.net？ – IamStalker 2012-02-11 22:49:41

你可以把它們飄浮：

#menu { 
    overflow: auto; 
} 

#menu > img { 
    float: left; 
}

現場演示：http://jsfiddle.net/bzWYX/

順便說一句我也問過類似的問題here。

來源

2012-02-11 22:58:59

您當前的解決方案不起作用，但是'font-size：0px'的確如此 – clarkk 2012-02-11 23:07:44

@clarkk浮動應該工作。兄弟姐妹和漂浮在同一側的圖像應該壓在一起（除非它們有邊距或邊框）。我很想看到你的問題的演示。 – 2012-02-11 23:14:11

在你的代碼中刪除img標籤之間的空格。

<div id="menu"> 
    <img src="/gfx/menu.home.png" /><img src="/gfx/menu.functions.png" /><img src="/gfx/menu.prices.png" /> 
</div>

來源

2012-02-11 22:50:13

這麼糟糕的解決方法。 HTML應該忽略空格，我不明白爲什麼不總是這樣。 – bricker 2012-02-11 23:17:12

@bricker解析HTML源代碼時，如果瀏覽器遇到一系列空格字符，它會將該序列壓縮爲一個空格。但是，如果兩個''標籤之間至少有一個空格字符，瀏覽器將在DOM中的這兩個圖像元素節點之間創建一個Text節點。 – 2012-02-11 23:23:53

白色空格會被忽略，但不是最後一個。如果一起有多個空格，則它們都將被忽略，但是最後一個（默認情況下）。在我看來，CRLF也應該被默認忽略。 – 2012-02-11 23:25:17

<div> 
    <img src="/gfx/menu.home.png" /><img src="/gfx/menu.functions.png" /><img src="/gfx/menu.prices.png" /> 
</div>

放在同一行的IMG標籤就可以了。

來源

2012-02-11 22:51:49

避免img之間的空格

回答

相關問題