div+css实现舞台聚光灯效果代码
代码语言:html
所属分类:布局界面
代码描述:div+css实现舞台聚光灯效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> body { --light-diameter: 50px; --light-radius: calc(var(--light-diameter) / 2); background: #020531; height: 100%; width: 100%; margin: 0; } body::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; filter: url(#noiseFilter) brightness(0.4) contrast(1.1); mix-blend-mode: overlay; z-index: 10; } #light1 { width: 50vw; height: 100vh; border: 1px solid pink; left: 25vw; position: absolute; background: radial-gradient(#f0f0ff, #f0f0ff 63%, transparent 75%) 50% 10%/25px 25.........完整代码请登录后点击上方下载按钮下载查看
网友评论0