css两张静态图片制作动态星空图
上个效果图，gif图像质量问题所以显示月亮蓝边，实际上很好看
需要素材：
star.html代码如下
<html lang="en"><head><meta charset="UTF-8"><title>CodePen - Moon And Sky</title><!--<link rel="stylesheet" href="css/style.css">--><style>.moon {position: absolute;top:0;left:0;right:0;bottom:0;margin: auto;width:100px;height:100px;border-radius:50%;background:white;opacity:0.9;box-shadow: 0px 0px 40px 15px white;z-index:1;}.stars, .twinkl {position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;display:block;}.stars {background:#000 url(stars.png) repeat top center;z-index:0;}.twinkl{background:transparent url(twinkling.png) repeat top center;z-index:0;-moz-animation:move-twink-back 200s linear infinite;-ms-animation:move-twink-back 200s linear infinite;-o-animation:move-twink-back 200s linear infinite;-webkit-animation:move-twink-back 200s linear infinite;animation:move-twink-back 200s linear infinite;}@keyframes move-twink-back {from {background-position:0 0;}to {background-position:-10000px 5000px;}}</style></head><body><div><div class="stars"></div><div class="moon"></div><div class="twinkl"></div></div></body></html>
没有错代码就这么一点，就展示了动态星空；动态的核心代码在这里
通过遮罩的效果缓慢移动显示和隐藏；
我们把背景调白看看是怎么运作的
资源已上传，需要的小伙伴可以下载啦
免费资源直通车:/download/qq_42197013/12534865
