辛苦老师检查
来源:2-18 编程练习
Lanny_Chung
2022-03-16 10:57:32
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>2-9</title> <style type="text/css"> div { font-family: Arial; font-size: 72px; font-weight: bold; position: fixed; right: 0; left: 0; width: 30px; height: 30px; margin: auto; transform: rotate(90deg); /*此处写代码*/ bottom:40px; animation:sports .5s ease .5s alternate infinite; } @keyframes sports{ from{ bottom:40px; } to{ bottom:10px; } } </style> </head> <body> <div>></div> </body> </html>
1回答
同学你好,动画效果可以的,但是箭头在水平方向上没有水平居中显示,超出了盒子大小
建议设置盒子大一些,并且设置文字水平垂直居中显示,如下
祝学习愉快!