div+css实现广告牌文字立体翻转动画效果代码
代码语言:html
所属分类:动画
代码描述:div+css实现广告牌文字立体翻转动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> @import url(https://fonts.bunny.net/css?family=sixtyfour:400); @layer base, demo; @layer demo { section { align-content: center; font-family: "Sixtyfour", monospace; } .flip-text { --clr-1: dodgerblue; --clr-2: hotpink; --clr-3: rgb(94 165 0); --translate-distance: 1lh; --duration: 3s; --timing-function: cubic-bezier(0.66, 0, 0.34, 1); overflow-y: hidden; width: min(100%, 1200px); margin-inline: auto; display: grid; grid-auto-columns: 1fr; grid-auto-flow: column; gap: 0; font-size: clamp(1rem, 4.5vw + 0.05rem, 5rem); font-weight: 700; color: var(--clr-1); li.........完整代码请登录后点击上方下载按钮下载查看
网友评论0