如何避免img
标签之间的空格?避免img之间的空格
在打印屏幕上的内容被标记
代码:
#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>
如何避免img
标签之间的空格?避免img之间的空格
在打印屏幕上的内容被标记
代码:
#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>
你可以把它们飘浮:
#menu {
overflow: auto;
}
#menu > img {
float: left;
}
现场演示:http://jsfiddle.net/bzWYX/
顺便说一句我也问过类似的问题here。
您当前的解决方案不起作用,但是'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>
这么糟糕的解决方法。 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标签就可以了。
如何删除填充和边距? – IamStalker 2012-02-11 22:41:45
你是什么意思?已更新我的问题 – clarkk 2012-02-11 22:45:35
你可以把它放在http://jsfiddle.net? – IamStalker 2012-02-11 22:49:41