body {
  display: flex;
  justify-content: center;
  /* 给背景一个渐变 */
  background: rgb(174,208,238);
  background: linear-gradient(90deg, rgba(174,208,    238,1) 0%, rgba(148,233,170,1) 100%);
}
* {
padding: 0;
margin: 0;
}
.a {
position: relative;
width: 300px;
height: 250px;
top: 150px;
}
.b {
position: absolute;
width: 300px;
height: 250px;
border-radius: 20px;
/* 设置渐变 */
background: linear-gradient(
  to right bottom,
  rgba(255, 255, 255, 0.6),
  rgba(255, 255, 255, 0.3),
  rgba(255, 255, 255, 0.2)
);
/* 重点：使元素背景模糊化 */
backdrop-filter: blur(11px);
/* 设置上高光和左高光，使其看起来更加逼真 */
border-top: 1px solid rgba(255, 255, 255, 0.8);
border-left: 1px solid rgba(255, 255, 255, 0.8);
}
.b span {
/* 设置文字的大小和粗细 */
font: 900 50px "";
position: absolute;
top: 10px;
left: 20px;
color: rgba(0, 0, 0, 0.5);
/* 设置文字阴影 */
text-shadow: 1px 1px 3px rgba(255, 255, 255, 0.7);
}
.b p {
font: 900 25px "";
position: absolute;
bottom: 20px;
right: 20px;
color: rgba(255, 255, 255, 0.3);
/* 设置字体间距 */
letter-spacing: 3px;
/*text-decoration: underline;*/
}
a{
text-decoration: underline;
color: rgba(255, 255, 255, 0.3);
}
a:hover{
  color: rgb(255, 255, 255);
}