如何让图片在垂直方向与 div的底部对齐 水平居中

需要图片的绝对定位postion: absolute.

一般定位时, 是用div去定位.

一般不直接用 非div去"绝对/相对"定位. 如不直接用

等去定位. 因为这些好像不好定位.

也就说, 定位时, 用div去做定位, 然后把真正要定位的内容 放在 "辅助定位"的 div中去.

然后, 再在 定位的div中, 去设置其中包含的内容的 水平对齐等方式.

因此, 有这样的思路, 如果 要求 某个 元素 脱离其正常的排列 位置, 要 "定位"在某个特殊的位置, 就应该想到 postion定位.

"position"定位, 理解这个含义:　就是为了使 元素 定位到其 非正常 排列的位置".

比如:

让图片在垂直方向与 div的底部对齐 水平居中?

让你的图片浮动。然后给他个bottom:0;

<div style="position:relative;height:100px;width:100px;border:1px solid red">

    <div style="width:100px;position:absolute; bottom:0;left:0; text-align:center;">

        <img src="***.gif" width="20" height="20">
    </div> 

</div>