Question

<body>

...other stuff...

<div style="width: 30px; margin-left: 500px; bottom: 0px;">
<img src="picture.png">
</div>


</body>

margin-left正在运作。无法弄清楚为什么图片不会粘在底部..

Answer 1

要使bottom生效，您还必须使用position设置为relative或absolute：

<div style="position:absolute; width: 30px; margin-left: 500px; bottom: 0">
  <img src="picture.png">
</div>

根据您的布局要求，使用absolute或relative位置。

注意： 设置position后，您还可以使用left，right和top。< / p>

Answer 2

您必须明确定位元素才能使用bottom属性：

对于绝对定位的框，此属性指定框的底部边距边缘在其包含块的底部填充边缘上方偏移的距离。

对于相对定位的框，此属性指定框的下边缘偏移到正常流程中的位置之上的距离。

DEMO - source

Answer 3

该元素缺少position规则，bottom生效。 quirksmode有一篇关于CSS定位的好文章。

Answer 4

我认为您正在寻找类似的东西。

<div style="width: 30px; margin-left: 500px;">
<img src="picture.png" style='display: block;'>
</div>

默认情况下，img下面有一些空格，高于文本基线。它不是边距或填充。更改此设置的最常用方法是将图像显示设置为阻止。