html - 文本对齐到绝对底部

Question

我正在尝试推送标题中的文本，以便每个字符的底部都接触到 div 的底部。几乎就像 div 的边框在每个字母下划线一样。我将如何做到这一点？我基本上是在尝试将我的文本向下推几个像素。

Answer 1

实现此目的的一种方法是将容器的位置设置为相对位置，并将子元素设置为绝对位置:

<div style="position:relative;height:200px;border:1px solid #ccc;">
    <div style="position:absolute;bottom:0px;left:0px;">
        I'm a bottom feeder...
    </div>
</div>

编辑

为了澄清起见，我没有使用 line-height，因为如果文本换行，它不会正确运行。

请参阅此处了解不同技术的分割。特别注意使用相对与绝对定位的示例:

http://jsfiddle.net/c2tqZ/1/