限制元素的高度但显示底部而不是顶部

Question

使用此示例标记，而不是在右上角的黑框中显示“ 1 ”，我希望显示“ ↓ ”，然后它应该全部显示在悬停上。

Answer 1

用这个：

#bar ul { margin:0; font-weight:700; position:absolute; bottom:8px; }

Answer 2

你可以把箭头放在顶部。 然后，将:hover高度向下调整2em，并在<ul>上添加一个-2em的上边距用于悬停; 这将有效隐藏悬停时的箭头。

列表看起来像这样：

<ul>
    <li>&darr;</li>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
</ul>

更新的CSS将是：

#bar:hover { height: 8em; }
#bar:hover ul { margin-top: -2em; }