Html “如何隐藏溢出”；在最上面；？

有没有办法隐藏div溢出的“顶部”而不是“底部”

这说明了我的意思。封闭的

div

具有

overflow-y:hidden

，但这会隐藏其内容的下部。我想把它的上半部分藏起来

---

强制性源代码（JSFIDLE中的逐字）：

此分区应“溢出”
在顶端！
此内容应显示

见此，您需要将内容包装在

绝对

定位DIV中，并将

底部设置为0，同时父容器的位置为
相对

HTML

你的意思是你想让内容从下往上流动而不是从上往下流动吗？我认为将所有内容封装在一个容器中，然后将容器底部对齐应该可以做到这一点：你仍然需要使用填充。请参见：-有一些结构不好的CSS和相互冲突的属性
*{
  -webkit-box-sizing:border-box;
     -moz-box-sizing:border-box;
          box-sizing:border-box;
}
*{margin:0;padding:0;border:0;}
#centered{
  margin:20px auto 0;
  overflow-y:hidden;
  height:150px;
  outline:5px solid green;
}
#centered,
#top,
#bottom{width:150px;}
#top   {height:120px;background-color:red;}
#bottom{height:150px;background-color:#555;}
#top,#bottom{
  color:white;
  text-align:center;
  padding:0 10px;
}
#top{padding-top:50px;}
#bottom{padding-top:60px;}

<div id="centered">
  <div id="top">
    this div should be "overflowed away"
    <em>at the top!</em>
  </div>
  <div id="bottom">
    this content should show
  </div>
</div>

<div id="centered">
    <div id='content'>
        <div id="top">this div should be "overflowed away" <em>at the top!</em>

        </div>
        <div id="bottom">this content should show</div>
    </div>
</div>

*{
    box-sizing:border-box;
    margin:0;
    padding:0;
}
#centered {
    margin:20px auto;
    overflow-y:hidden;
    height:150px;
    border:5px solid green;
    width:150px;
    position:relative;
}
#content {
    bottom:0px;
    position:absolute;
}
#top {
    min-height:120px;
    background-color:red;
    padding-top:50px;
}
#bottom {
    background-color:#555;
    padding:60px 10px 0 0;    
}
#top, #bottom {
    color:white;
    text-align:center;
}