如何使用填充在文本旁边定位图像？

Question

<h2><img src="img.jpg" height="75px"> some text</h2>

我想将我的图像放在文本块的旁边，但稍微填充一下，我该如何实现？我在图片标记内尝试style: padding 10px;但没有成功。

Answer 1

我认为你正在寻找这样的东西。 http://jsfiddle.net/3HZr7/

<h2>
    <img src="img.jpg" height="75px"> 
    <span>some text</span>
</h2>



h2{
  overflow: auto;    
}

h2 span{

   float: left;
   margin-top: 10px;
   margin-left: 10px;
}

h2 img{
   float: left;        
}​

Answer 2

您误解了 CSS box model 。

填充是指盒子内部的空间，另一方面，边缘负责盒子外面的空间，即盒子与容器之间的空间。

所以你可能的解决方案很简单：

1. 在父元素上应用padding。
2. 在图片元素上应用margin。

<强> Example.