我尝试用更少的关键帧生成关键帧。这是我的代码,包含结果和预期输出。 我搜索了如何在变量中添加特殊字符,但无法找到解决此问题的方法。
任何人都可以告诉0'%'可以转换为0%(其他百分比值相同)
@keyframes spin{
@sign:'%';
.rotate(0,0,90,25);
.rotate(@percent:0, @deg:0,@degDiff, @percentDiff) when (@percent <= 100) {
@{percent}@{sign} {
transform: rotate(@deg deg);
}
.rotate(@percent+@percentDiff, @deg+@degDiff, @degDiff, @percentDiff);
}
}
输出
@keyframes spin {
0'%' {
transform: rotate(0 deg);
}
25'%' {
transform: rotate(90 deg);
}
50'%' {
transform: rotate(180 deg);
}
75'%' {
transform: rotate(270 deg);
}
100'%' {
transform: rotate(360 deg);
}
}
预期结果
@keyframes spin {
0% {
transform: rotate(0 deg);
}
25% {
transform: rotate(90 deg);
}
50% {
transform: rotate(180 deg);
}
75% {
transform: rotate(270 deg);
}
100% {
transform: rotate(360 deg);
}
}