我想让我的标签动画从上往下展开,而不是从下往上。这样顶部就会打开,而底部则保持不变:
div.label4 {
background-color: #4D6EF6;
width: 278px;
height: 388px;
margin: 10px auto;
text-align: center;
vertical-align: middle;
color: #4D6EF6;
font-size: 30px;
font-weight: bold;
border-radius: 4px;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
text-decoration: none;
border: transparent;
float: left;
transition: width 1.5s, height 1.5s;
transition-duration: 1.5s
}
div.label4:hover {
height: 194px;
}
<div class="label4"></div>
~2.5%
。经典 :) - taoposition
,目前已经被100%的浏览器支持。而我使用的是flexbox
,目前支持率为97.71%
。点击 [Show all] 可以查看详细信息。Caniuse最酷的地方是它还提供了已知问题的解决方法,真的非常有用。顺便提一下,CSS Grid
也正在逐渐兴起。一个月前,支持率还只有约5%。 - tao