我试图将下面的代码基本上转换为可扩展的版本,我尝试使用vw和vh,%值等等,我似乎无法获得正确的值的平衡.任何帮助表示赞赏.
这个codepen也可能有所帮助:http://codepen.io/anon/pen/dPNgvP
.arrow {
position: relative;
height: 0px;
width: 0px;
border-top: 18px solid #dd1111;
border-left: 11px solid transparent;
border-right: 11px solid transparent;
position: absolute;
bottom: 40px;
left: 57px;
z-index: 1;
animation: load-arrow 1.6s linear;
animation-fill-mode: forwards;
-webkit-animation: load-arrow 1.6s linear;
-webkit-animation-fill-mode: forwards;
}
@keyframes load-arrow {
from {
transform: translate(0, 0);
}
to {
transform: translate(0, 55px);
}
}
@-webkit-keyframes load-arrow {
from {
-webkit-transform: translate(0, 0);
}
to {
-webkit-transform: translate(0, 55px);
}
}
.pie {
width: …Run Code Online (Sandbox Code Playgroud)