请老师检查,谢谢!
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>2-4</title> <style type="text/css"> div { font-family: 'Microsoft Yahei'; font-size: 60px; font-weight: bold; line-height: 600px; position: absolute; top: -1000px; right: 0; left: 0; width: 800px; height: 600px; margin: auto; text-align: center; border: 5px solid #000; border-radius: 50%; animation-name: disp; animation-duration: 1s; animation-delay: 1s; } @keyframes disp{ form{ top: -1000px; } to{ top: 80px;} } </style> </head> <body> <div>大家好,欢迎来到慕课网!</div> </body> </html>
老师,我想问问怎么实现让完成后可以固定在那里。
7
收起
正在回答
1回答
同学你好,效果正确。让动画保持在最后一帧的话,可以使用:animation-fill-mode 属性,属性规定动画在播放之前或之后,其动画效果是否可见。
forwards 当动画完成后,保持最后一个属性值
如果我的回答帮到了你,欢迎采纳,祝好学习愉快~
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星