div+css布局实现磨砂玻璃材质卡片文字效果代码

代码语言:html

所属分类:布局界面

代码描述:div+css布局实现磨砂玻璃材质卡片文字效果代码

代码标签: div css 布局 磨砂 玻璃 材质 卡片 文字

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >
<head>
 
<meta charset="UTF-8">
<style>
    :root {
  --noise: url('data:image/svg+xml,
<svg xmlns="http://www.w3.org/2000/svg" width="500" height="500"><filter id="fractalNoise" x="0" y="0"><feTurbulence type="fractalNoise" baseFrequency=".45" numOctaves="3" stitchTiles="stitch"/><feBlend mode="screen"/></filter><rect width="500" height="500" filter="url(%23fractalNoise)" opacity="0.5"/></svg>');
}


body {
  min-height: 100vh;
  margin: 0;
  font-family: system-ui, sans-serif;
  display: grid;
  place-content: center;
  background-color: #25282a;
}

.container {
  color: #fefefc;
  width: min(45ch, 100% - 2rem);
  margin: 0 au.........完整代码请登录后点击上方下载按钮下载查看

网友评论0