css星星闪动画效果 |thinkphp 文件引入css

.star {
display: inline-block;
border-radius: 50%;
width: 5px;
height: 5px;
background-color: #fff;
position: relative;
animation: twinkling 1s ease-in-out infinite alternate;
}
.star:before,
.star:after {
content: "";
display: block;
border-radius: 50%;
background-color: inherit;
position: absolute;
}
.star:before {
width: 50%;
height: 50%;
top: -25%;
left: 15%;
}
.star:after {
width: 25%;
height: 25%;
bottom: -10%;
right: 25%;
}
@keyframes twinkling {
0% {
transform: scale(1);
opacity: 1;
}
100% {
transform: scale(2);
opacity: 0;
}
}

上述代码实现了星星闪动的效果，可以通过调整熟悉的属性来改变星星的大小、颜色、闪烁速度等等。

在网页中使用这个效果可以增加网页的视觉动感和趣味性，吸引用户的注意力。但是也要注意不要过度使用，以免影响页面的美感和用户体验。