div {
height: 0px;
width: 1px;
border-bottom: 1px solid #000;
-webkit-animation: increase 3s;
-moz-animation: increase 3s;
-o-animation: increase 3s;
animation: increase 3s;
animation-fill-mode: forwards;
}
.tt {
div {
height: 0px;
width: 1px;
border-top: 1px solid #000;
-webkit-animation: increase 3s;
-moz-animation: increase 3s;
-o-animation: increase 3s;
animation: increase 3s;
animation-fill-mode: forwards;
}
}
@keyframes increase {
100% {
width: 300px;
}
}<div></div>
<div class="tt"></div>如何使用 css 影片繪制水平和垂直線。像“L”字母。
目前我只能畫垂直線
uj5u.com熱心網友回復：
通過將影片設定為繪制影片的前 50% 的垂直位和影片的后 50% 的水平位，您可以在一個元素中先繪制垂直位，然后在一個元素中繪制水平位.
這是一個簡化的片段：
div {
height: 0px;
width: 1px;
border-left: 1px solid #000;
border-bottom: 1px solid #000;
-webkit-animation: increase 3s;
-moz-animation: increase 3s;
-o-animation: increase 3s;
animation: increase 3s;
animation-fill-mode: forwards;
}
@keyframes increase {
50% {
height: 300px;
width: 1px;
}
100% {
height: 300px;
width: 300px;
}
}<div></div>轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/393545.html
上一篇：如何在這個函式中輸入值？
下一篇：GODOT-全攻擊影片未播放