容器加背景图
内容
<div class="card shadow p-3 bg-color container" style="box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); border: none; background-image: url('https://files.getquicker.net/_sitefiles/kb/sharedaction/f4ec8fd6-a1d5-45a9-92cc-08d9a6ab0e9a/2024/12/15/094848_202824_bg.jpg'); background-size: cover; background-position: center;">
内容
<style> .card-color { width: auto; /* 设置卡片的宽度 */ padding: 20px; /* 内边距 */ border-radius: 5px; /* 圆角 */ /* 背景图片 */ background-image: url('https://files.getquicker.net/_sitefiles/kb/sharedaction/f4ec8fd6-a1d5-45a9-92cc-08d9a6ab0e9a/2024/12/15/094732_202824_8c2e075fad9ce9ff02f44307fbc6b952.jpg'); /* 替换为您的图片 URL */ background-size: cover; /* 背景图片填充整个容器 */ background-position: center; /* 背景图片居中 */ 【暂停】background: linear-gradient(to bottom, rgba(255, 255, 255, 0.9) 10%, rgba(255, 255, 255, 0.8) 60%); /*--- 内部卡片背景色 --*/ box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1); } </style>