css+js实现繁星闪闪动画效果代码
代码语言:html
所属分类:动画
代码描述:css+js实现繁星闪闪动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> .star { --size: 20vmin; --holes: calc(var(--size)*.495); width: var(--size); aspect-ratio: 1/1; position: fixed; background: white; --mask: radial-gradient(var(--holes) at var(--holes) var(--holes), #0000 99%,#000) calc(var(--holes)*-1) calc(var(--holes)*-1); -webkit-mask: var(--mask); mask: var(--mask); border-radius: 50%; animation: sparkle 1s linear forwards; } @keyframes sparkle { 0% { transform: scale(0); } 25% { opacity: 1; } 100% { opacity: 0; } } html { background: #112; overflow: hidden; display: grid; place-items: center; min-height: 100vh; } h1 {.........完整代码请登录后点击上方下载按钮下载查看
网友评论0