前言：
现时朋友们对“html流星雨代码怎么用”大约比较重视，小伙伴们都需要学习一些“html流星雨代码怎么用”的相关内容。那么小编在网络上搜集了一些关于“html流星雨代码怎么用””的相关文章，希望小伙伴们能喜欢，大家快快来了解一下吧！一、引言
当流星划过静谧的太空，一个个美好的愿望流逝，我还没来得及许愿。但我依旧静静等候，等候希望的降临，等候下一站的流星雨..
二、思考过程
1. 我们来给宇宙一个颜色，并border边框属性画出圆形，当做一个月球。
设定好宽高，用边框做出圆形的灰色月球，用定位结合margin负值把月球放在页面中心位置。
代码图示如下：
2. 现在我们来做月球右下角阴影部分
画出一个深灰色的圆环，并在.plant上设置好溢出空间不显示的声明。
那现在看起来月球已经有一些立体效果了吧！
代码图示如下：
3. 月球上的陨石坑的处理方式我们会使用box-shadow进行处理，放在合适位置
box-shadow: inset 3px 3px 0 rgba(0, 0, 0, .2);
声明解析：
box-shadow:inset(将外部阴影改变内部阴影) 水平阴影位置 垂直阴影位置 模糊距离 颜色
代码图示如下：
那我加了四个陨石坑，大家可以运用得更细致些，做出来的月球会更逼真。
三、结束语
那我们已经将这个月球用css画好了，那下期我们将教大家怎样去写流星，并让流星缓缓地划过夜空。
版权声明：
本站文章均来自互联网搜集，如有侵犯您的权益，请联系我们删除，谢谢。
标签： #html流星雨代码怎么用 #html流星雨代码qq #html制作流星雨 #css流星效果
