28 lines
831 B
Markdown
28 lines
831 B
Markdown
# 2026-03-03 经验
|
||
|
||
## 我的页面卡片区边距优化
|
||
|
||
### 问题/场景
|
||
|
||
用户反馈「我的」页面的卡片区域左右边距过大，内容区在水平方向上显得较窄，未充分利用屏幕横向空间。
|
||
|
||
### 解决方案
|
||
|
||
将卡片区域及上下关联区块的左右边距统一缩小：
|
||
|
||
| 区块 | 修改前 | 修改后 |
|
||
|------|--------|--------|
|
||
| `.main-content` | 32rpx | 16rpx |
|
||
| `.header-block` | 40rpx | 16rpx |
|
||
| `.guest-block` | 48rpx | 16rpx |
|
||
| `.card` padding | 40rpx | 32rpx |
|
||
| `.card` margin-bottom | 32rpx | 24rpx |
|
||
|
||
### 提炼规则
|
||
|
||
个人中心、设置类页面（如「我的」）的卡片区左右边距宜紧凑，**推荐 16rpx**；卡片内边距 32rpx、卡片间距 24rpx，以充分利用横向空间。
|
||
|
||
### 适用
|
||
|
||
- `miniprogram/pages/my/` 及类似个人中心、设置页
|