【小白学前端】化腐朽为神奇-HTML+CSS3实现旋转地球（day02-4）

长安紫薯

于 2021-05-10 08:43:22 发布

阅读量1.5k

点赞数 2

CC 4.0 BY-SA版权

分类专栏： front-end 大前端文章标签： html css3

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.youkuaiyun.com/nutony/article/details/116583624

功能需求

实现地球旋转，本质是一张图片，在网页中图片都是矩形没有直接提供圆形，CSS3提供了圆角样式，非常方便的解决了这个问题。
先准备一个正方形的图片，然后设置其当圆角超过图片半径时，自然就成为一个圆。
CSS3增加了强大的动画功能，可以让图片进行旋转。

界面原型

在这里插入图片描述

实现代码

<!DOCTYPE html>     
<html>     
<head>     
    <meta charset="UTF-8">

最低0.47元/天解锁文章

200万优质内容无限畅学

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。