【问题标题】:make an image and a paragraph sit next to each other使图像和段落彼此相邻
【发布时间】:2011-03-08 00:12:41
【问题描述】:

我有一个带有图像和一些 txt 的盒子,我希望 txt 与图像水平。我知道这可能是一个非常简单的问题,但我似乎无法在互联网上找到一个好的答案。感谢您的帮助。

<div id='container'>
 <img src='someimage.jpg'/>
 <p>some text</p>
</div>

【问题讨论】:

标签: html alignment image paragraph


【解决方案1】:

我建议您将文本和图像放在一个表格中,在同一行中,图像位于第一列,而文本位于第一行的第二列。这是代码

<div id='container'>
  <table>
    <tr>
     <td><img src='someimage.jpg'/></td>
     <td><p>some text</p></td>
    </tr>
  </table>
</div>

【讨论】:

    【解决方案2】:

    看一下 CSS 的 float 属性,例如:

    <div id='container'>
     <img src='someimage.jpg' style='float: left;'/>
     <p>some text (that will now wrap around the image</p>
    </div>
    

    【讨论】:

    • 是的,我已经这样做了,但对我来说没有意义的是该段落抛出了图像。就像我添加填充一样,填充是针对容器而不是 img。段落的边距也会影响 img 并且两者都被推离容器的顶部。
    • 您确定要在图像上留出边距吗?
    • 不在此范围内。我一直想知道将事物设置为 position:"absolute" 然后只使用顶部和底部给它们 x y 线是不好的做法吗?
    猜你喜欢
    • 1970-01-01
    • 2013-04-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-01-28
    • 1970-01-01
    • 2017-12-26
    相关资源
    最近更新 更多