| 公司名称 | 最小值固定 | 基准值固定 | 最大值固定 | 文字标准 | 布局 | 最小固定宽度 |
|---|---|---|---|---|---|---|
| 知乎 | 无设置 | 无设置 | 无设置 | px | 百分比+px | 无 |
| 搜狐 | rem随宽度变化 | 375（37.5px） | rem随宽度变化 | px | 百分比+flex+rem | 无 |
| 大众点评 | 无设置 | 无设置 | 无设置 | px | 百分比+flex+px | 无 |
| 携程 | 无设置 | 无设置 | 无设置 | px | 百分比+flex+px | 无 |
| 腾讯 | 300（80px） | 375（100px） | 768（204.8px） | rem | 百分比+flex+rem | 无 |
| 陆金所 | rem随宽度变化 | 375（50px） | rem随宽度变化 | rem | 百分比+rem | 无 |
| 饿了么 | rem随宽度变化 | 375（75px） | rem随宽度变化 | rem | 百分比+flex+vw | 无 |
| 网易 | 320（13.33vw） | 固定（13.33vw） | 769（13.33vw） | rem | 百分比+flex | 无 |
| 京东 | 320（17.06667px） | 固定（20px） | 540（28.8px） | rem | 百分比+rem | 320 |
| 小红书 | rem随宽度变化 | 375（50px） | 450（60px） | rem | 百分比+flex+rem | 无 |
| 微博 | 414（16.96px） | 固定（16.96px） | 768（20px） | rem | 百分比+rem | 无 |
| 美团 | 固定（50px） | 固定（50px） | 固定（50px） | rem | 百分比+rem | 320 |
| 哔哩哔哩 | vw随宽度变化 | vw随宽度变化 | vw随宽度变化 | vw | 百分比+vw | 无 |
- 知乎为了更好的阅读体验，使用 百分比 和 px 做自适应布局
- 哔哩哔哩后续替换成 vmax、vmin 进行响应式布局，因为兼容宽度大于高度的情况更好
- 在使用最小宽度
min-width时，需要将viewport设置为user-scalable=0，使其不随页面缩放 - 使用
vw做响应式布局，无法使用 min-width，因为vw不受 width 影响，只受设备宽度影响
编辑 | sishen
来源 | 前端兔
公众号 | 前端兔
关注公众号查看更多前端知识分享~~
