Question

您好，我不知道如何处理特定问题，所以在这里。如果不使用表格，我想显示一个带有多行文字的段落，然后在右边显示一个图像。

到目前为止，我已经尝试过这个：

<div id="container">
 <p>
  Some Text
  Some Text
  Some Text
  Some Text
 </p>
 <p>
 <img src="image.jpg"/>
 </p>
</div>

我使用单独的样式表并且已经尝试过显示内联而没有运气的东西。

我会感激任何建议，虽然我不想使用表格，因为我不喜欢使用表格进行布局。

谢谢。

Answer 1

您的容器需要另一组容器：

<div style="float:left;width:50%">
<p>...<p/>
</div>
<div style="float:left;width:50%">
<p>...<p/>
</div>

Answer 2

如果我明白你想做什么。你可以给

标签一个类/样式并在CSS中执行float：right。看起来像这样：

<p style="float:right;"><img src="image.jpg" /></p>

Answer 3

你想要图像周围的文字流吗？如果是，则它是这样的：

如果你想要单独的图像列，那么它是这样的：

Answer 4

如果你可以考虑使用flexbox（现在支持得很好：https://caniuse.com/#feat=flexbox）

你只需要让你的容器成为一个展示：flex; （例如：https://codepen.io/anon/pen/GvZYwj）

#container { 
  display: flex;
}

如果你想了解更多有关flexbox的信息，可以使用这个惊人的教程：http://flexboxzombies.com/p/flexbox-zombies