css实现价格套餐卡片显示动画效果代码
代码语言:html
所属分类:动画
代码描述:css实现价格套餐卡片显示动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> /*@property --cost { syntax: '<integer>'; initial-value: 0; inherits: true }*/ * { margin: 0; border: none; background: transparent; color: inherit; font: inherit; text-transform: inherit; } body, body :not(script):not(style), ::before { display: grid; } body { grid-gap: 2em; grid-template-columns: repeat(auto-fit, Min(100%, 12rem)); place-content: center; min-height: 100vh; background: #222; font: 900 1.25em/1.25 sans-serif; text-align: center; text-transform: uppercase; } article { --m: calc(.5*(var(--n) - 1)); .........完整代码请登录后点击上方下载按钮下载查看
网友评论0