|
@@ -31,21 +31,26 @@
|
|
|
}
|
|
|
|
|
|
.welcome-card {
|
|
|
- position: relative;
|
|
|
- margin: -60rpx 32rpx 0;
|
|
|
- border-radius: 16rpx;
|
|
|
- overflow: hidden;
|
|
|
- background: #fff;
|
|
|
+ position: absolute;
|
|
|
+ left: 2%; /* 使用百分比替代固定像素 */
|
|
|
+ top: 128px; /* 顶部距离可以保持固定,或根据需要调整 */
|
|
|
+ width: 96%; /* 宽度占父容器的 96%,留出左右 2% 的边距 */
|
|
|
+ height: 188px; /* 高度可以根据需要调整 */
|
|
|
+ opacity: 1;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 8px; /* 圆角 */
|
|
|
+ box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
|
|
|
+ overflow: hidden;
|
|
|
}
|
|
|
|
|
|
.card-bg {
|
|
|
position: absolute;
|
|
|
- right: 0;
|
|
|
- bottom: 0;
|
|
|
- width: 160rpx;
|
|
|
- height: 160rpx;
|
|
|
- opacity: 0.8;
|
|
|
- z-index: 1;
|
|
|
+ width: 105%; /* 宽度超出 .welcome-card 的 5%,实现覆盖效果 */
|
|
|
+ left: -2.5%; /* 向左偏移 2.5%,使背景居中 */
|
|
|
+ height: 100%; /* 高度与 .welcome-card 一致 */
|
|
|
+ opacity: 1;
|
|
|
+ background-color: #f0f0f0; /* 背景色 */
|
|
|
+ border-radius: 8px; /* 圆角 */
|
|
|
}
|
|
|
|
|
|
.card-content {
|