小程序多端适配规则

小程序多端适配必要性

随着用户通过不同设备访问小程序的需求增加，不再仅局限于手机，如折叠屏、平板等。因此，建议开发者根据用户使用的设备和场景，对小程序提供多端适配，保证页面各个模块和功能组件能够正常展示和交互使用，同时保证兼容不同操作系统。

屏幕宽度范围

目前小红书主要支持 平板 和 折叠屏 的适配方案，具体屏幕宽度参考范围如下：

小程序适配规则

• 当 Width ≤ 480dp 时，整体等比缩放。
• 当 Width ≥ 480dp 时，页面等宽 480dp 居中展示，背景填充颜色，颜色支持配置。

小程序多端适配注意要点

1. 保证信息完整且清晰展示

• 图片、视频等视觉元素不应发生变形、过度拉伸、关键信息裁剪等信息缺失问题
• 避免大屏图片拉伸后出现图片模糊、分辨率下降等问题

2. 顶部导航栏与底部导航栏

顶部导航栏与底部导航栏高度在适配后保持不变。

3. 弹窗的展示规则

需要将弹窗平居中，且避免不稳定拉伸，当 Width ≥ 480dp 时：弹窗圆角均为12dp，离底边距 16dp。