Html 如何保持img元素与文本相邻？_Html_Image_Layout

Html 如何保持img元素与文本相邻？

html image layout

Html 如何保持img元素与文本相邻？,html,image,layout,Html,Image,Layout,我觉得这肯定是一个常见问题，但我还没有找到答案我有一个小图像运行在一个HTML页面上的一些文本。图像需要与后面的单词保持一致，但尽管在二者之间使用了，甚至将二者直接放在一起，Firefox有时会在二者之间设置一个换行符我还应该承认，被包装为2UXX B:308-375的内容 &米德多；2V1D B:308-375 如果显示该页面并慢慢缩小浏览器，则第二幅图像后该行将断开。没有涉及css edit2-我在该版本发布了一个精简的示例，它根本没有元素，并且包含实体。摆弄结果框的宽度以查看症状。

我觉得这肯定是一个常见问题，但我还没有找到答案

我有一个小图像运行在一个HTML页面上的一些文本。图像需要与后面的单词保持一致，但尽管在二者之间使用了

，甚至将二者直接放在一起，Firefox有时会在二者之间设置一个换行符

我还应该承认，

被包装为

2UXX B:308-375的内容
&米德多；2V1D B:308-375

如果显示该页面并慢慢缩小浏览器，则第二幅图像后该行将断开。没有涉及css

edit2-我在该版本发布了一个精简的示例，它根本没有

元素，并且包含

实体。摆弄结果框的宽度以查看症状。


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
</head>
<body>
&middot; <a href="example.com"; onmouseover="return true"><img height="9" width="9" src="logo-break.gif" alt="pic" /></a>2UXX&nbsp;B:308-375
&middot; <a href="example.com"; onmouseover="return true"><img height="9" width="9" src="logo-break.gif" alt="pic" /></a>2V1D&nbsp;B:308-375
</body>
</html>

.container{宽度：400px；}
Lorem ipsum dolor sit amet，是一位杰出的献身者。Curabitur velit velit，cursus vitae consequat a，facilisis eu Elite。在这本书中，作者是一位杰出的作家。毛里斯·奈克·莱克特·奈克·奈克·奈克特·奈克特·奈克特·奈克特·奈克特·奈克特·奈克特·奈克特·奈克特·奈克特·奈克特·奈克特·奈克特·奈克特。特氏前庭。这是一个很好的例子。前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭，前庭。侵权人，侵权人，侵权人，侵权人。乌拉姆科珀酒店。同侧共济会。Mauris blandit sapien和nulla ultrices a consequat nisi sagittis

好的，一个似乎有效的解决方案是在需要保持在一起的图像和文本周围放置一个

，然后在跨度上设置CSS，说：

空白：nowrap是否显示：内联您要查找的内容？您可以发布代码吗？因为FF有时会在两者之间插入换行符，所以可能是容器宽度不够宽，所以它会包裹。张贴一些code@Andre，我不这么认为。图像肯定是以内联方式显示的，我认为这是默认设置。这就是文本的流动方式。编辑问题并发布相关的html/css代码，发布一个fiddle将是最好的jsfiddle.net
<html>
<head><style>.container { width: 400px; }</style></head>
<body>
<div class="container">
<img src="http://lipsum.com/images/lipsum07.gif" style="float: right;" />
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur velit velit, cursus vitae consequat a, facilisis eu elit. In quis elit non enim semper dictum eget sagittis velit. Mauris nec lectus vitae mi faucibus rutrum non et nunc. Vestibulum ultrices suscipit blandit. Praesent faucibus sagittis arcu, nec convallis dui sodales sit amet. Aenean sapien metus, vestibulum a lacinia id, rhoncus vitae tellus. Fusce enim tortor, suscipit eu tincidunt eu, accumsan eu nulla. Nulla porttitor ullamcorper suscipit. Maecenas vel consectetur ipsum. Mauris blandit sapien et nulla ultrices a consequat nisi sagittis.</p>
</div>
</body>
</html>