html - 如何获得这个布局?

标签 html css

如何得到这个布局

绿色框有float:left,我可以通过修复图像的margin-bottom来做到这一点,但文本数量可以增加或减少。

alt text http://shup.com/Shup/362173/110511132520-My-Desktop.png

最佳答案

http://jsbin.com/uzevu

  #stuff img {
    float:left;
    margin-right:25px;
  }

  #stuff p {
    margin-left:150px;
  }


  <div id="stuff">
    <img src="http://dummyimage.com/125x125/000/fff" />
     <p>
       Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
    </p>
  </div>

关于html - 如何获得这个布局?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3022689/

相关文章:

javascript - 在 dsp(动态服务器页面)中打开新选项卡时无法添加页面加载微调器

html - 子 div 是可滚动的,但在子内添加内容时 body 的高度仍然增加

javascript - 表单内的输入问题

javascript - 将div放入 slider

javascript - 如何防止 Javascript 调整宽度卡顿

javascript - 无法滚动到移动页面的绝对底部

javascript - 扩展 div 的高度以从初始位置到达容器底部

javascript - 我的 onclick 附加到在同一函数中被删除的类。为什么它仍然被触发?

HTML 和 CSS 自定义字体未出现在我的页面上

html - 如何选择这个一般的 sibling ?