我有一个 div,当鼠标悬停在它上面时,它的高度会从 50px 扩展到 125px。我想在 div 的底部放置一些文本和图像,以便在 div 展开之前隐藏它,并在展开滚动时显示出来。这是我在 CSS 中的扩展语法:
.Home {
height:50px;
width:100px;
display:inline-block;
position:relative;
z-index:1;
transition: height .5s ease-in-out;
-webkit-transition: height .5s ease-in-out;
}
.Home:hover {
height 150px;
}
任何人都可以帮助我指明正确的方向吗?
最佳答案
您只需将 overflow:hidden 添加到 .Home 类定义中即可。还要在 .Home:hover 类中的高度后添加冒号。
.Home { height:50px;
width:100px;
display:inline-block;
position:relative;
z-index:1;
transition: height .5s ease-in-out;
-webkit-transition: height .5s ease-in-out;
overflow:hidden;
}
关于html - 隐藏文本直到 HTML 元素展开以显示它?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29383163/