uniapp基准宽度

uniapp基准宽度的概念

在uniapp中，基准宽度通常指设计稿的参考宽度，用于实现多端适配。默认以750rpx为基准（对应设计稿宽度750px），开发时可直接按设计稿像素值书写rpx单位，uniapp会自动根据屏幕宽度进行等比缩放。

设置自定义基准宽度

若设计稿非750px宽，需在uni.scss中修改全局变量：

$uni-width: 640px; // 将基准宽度改为640px

页面中使用rpx时，将自动按新基准计算适配比例。

动态计算rpx的方法

通过js计算特定屏幕下的rpx值：

const screenWidth = uni.getSystemInfoSync().screenWidth;
const rpxValue = (750 * pixelValue) / designWidth; // pixelValue为设计稿像素值

注意事项

• 使用rpx单位时，部分CSS属性（如边框）可能在不同端表现不一致，需通过条件编译调整。
• 复杂布局建议结合flex弹性布局，避免完全依赖rpx换算。
• 设计稿宽度与基准宽度差异较大时，建议优先调整设计稿尺寸或分段适配。