html - HTML/CSS 如何格式化文本并在其旁边浮动一个图像

Question

我的 HTML 和 CSS 技能相当生疏，我以前做过这个，但忘记了如何做到这一点。

我在页面左侧有文本，我希望在此 div 右侧的图像旁边有一个图像，浮动在那里并且不会干扰文本格式。

Text Description.....
Description..........
Description..........                             Image Goes About Here
Description..........
Description..........

有谁知道如何做到这一点？谢谢你。

Answer 1

简单的解决方案是使用 display: inline-block 在图像旁边显示信息，而无需添加内联 css。

img, p {
   display: inline-block;

}


<img src="image.png" />
 <p>
 text left
 </p>

Answer 2

使用填充和浮动...

IE

<div id="container">
  <div id="text" style="padding-right: <image-width+few px>">
     text text text
     text text text
  </div>
  <img src="<imagesrc" style= "float:right" />
</div>

填充，使文本不与图像重叠。这应该会给你想要的效果。在图像之后，添加一个带有 clear:both 的 div 以返回使用 div 的所有暗淡。

Answer 3

例如
<style type="text/css">
#picture {
float: right;
}
#text {
margin-right: 110px;
}
</style>

已编辑