-1
A
回答
0
如果您对固定空格字母感到满意,那么您可以在纯CSS中使用它:fiddle。
<p>
<span>N</span>
<span class="vowel">i</span>
<span>c</span>
<span class="vowel">o</span>
<span>l</span>
<span class="vowel">a</span>
<span>s</span>
</p>
<style>
p span {
display:inline-block;
width:0.7em;
text-align:center;
}
.vowel {
opacity:0;
width:0em;
animation:enter 0.6s 0.4s forwards;
}
.vowel ~ .vowel {
animation-delay:0.6s;
}
.vowel ~ .vowel ~ .vowel {
animation-delay:0.9s;
}
@keyframes enter {
0% { width:0; opacity:0; }
49% {opacity:0;}
50% {opacity:1;}
100% { width:0.7em; opacity:1;}
}
</style>
+0
感谢您的意见。我想玩这个小提琴找到固定宽度的解决方案!这是一个很好的开始 – nclsvh
相关问题
- 1. Silverlight宽度平滑动画
- 2. Android平滑宽度更改动画
- 3. css动画之间的平滑过渡
- 4. css动画之间的平滑过渡
- 5. CSS画布圆平滑度
- 6. 平滑CSS3动画
- 7. 平滑animateLayoutChanges动画
- 8. JQuery平滑动画
- 9. 平滑SVG动画
- 10. 平滑jQuery动画
- 11. WPF平滑动画
- 12. 平滑Flash动画
- 13. 平滑画布动画
- 14. 平滑JQuery宽度变化
- 15. WinRT的平滑Grid.Column改变动画
- 16. 平滑地改变jQuery动画
- 17. 平滑渐变背景动画java
- 18. 平滑的CSS渐变
- 19. 滑动滑块 - CSS动画闪烁
- 20. jQuery CSS - 滑块滑动动画
- 21. 图像动画不平滑
- 22. 平滑的PostScript动画
- 23. 平滑的SVG轴动画
- 24. jQuery的平滑/ JavaScript动画
- 25. 平滑动画停止
- 26. 更平滑的动画ImageSwitcher
- 27. 使jQuery动画更平滑
- 28. jQuery动画更平滑吗?
- 29. JQuery UI平滑列动画
- 30. Android平滑图像动画
为什么downvote而不让我知道为什么?这对任何人都没有帮助.. – nclsvh
可能是因为你没有给我们任何线索,你已经尝试过。你不必是专家就可以开始做这件事,但是在你问及是否有可能的事情之前,你需要努力做出努力。如果您不向我们提供代码(最好在您的答案中的代码段中),我们也无法帮助您调试您的努力,也不是代码编写服务。阅读[如何创建一个MCVE](https://stackoverflow.com/help/mcve)了解更多信息。 (注意:如果你想知道,我不是downvoter)。 – chazsolo
@chazsolo事情是我不知道如何开始,即使丝毫没有,除了像素的像素。无论如何谢谢 – nclsvh