纯css实现文字三维旋转走光效果
代码语言:html
所属分类:三维
代码描述:纯css实现文字三维旋转走光效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> * { margin: 0; } body { background: linear-gradient(gray, black); width: 100vw; height: 100vh; display: grid; place-items: center; } h1 { color: transparent; font-family: arial; font-size: 17rem; font-weight: 900; background: repeating-linear-gradient(45deg, black, transparent 5px), repeating-linear-gradient(-45deg, black, transparent 5px) lime; -webkit-background-clip: text; -webkit-text-stroke: 10px lightgreen; filter: drop-shadow(0 5px 4px black); animation: rock 2s ease-in-out infinite; } h1::after { content: "CSS"; z-index: 2; position: absolute; left: 0; -webkit-text-stroke: 7px black; background: radial-gradient( circle at 0 .........完整代码请登录后点击上方下载按钮下载查看
网友评论0