2025-11-20 07:33:24
苹果手机每台设备的屏幕尺寸不一样,比如iPhone13是1170x2532像素,但网页设计时要留出顶部和底部各44像素的安全区,这样内容才不会被刘海或者导航栏挡住。全面屏手机比如iPhone14 Pro,设计宽度要减去左右各44像素,总宽度变成1032像素,高度还是2532像素。不同型号的分辨率都不同,但安全区域位置固定,所以设计时要先查清楚具体机型。
苹果官网数据明确写着iPhone13分辨率是1170x2532像素,安全区域是顶部44+底部44=88像素,所以实际有效宽度是1170-88=1082像素。但实际开发中还要考虑左右边距,通常留出15像素,这样有效设计宽度变成1082-30=1052像素。比如设计登录页,图片宽度要控制在1052像素内,高度不超过2532-88-44=2400像素,避免被状态栏和导航栏遮挡。数据来源苹果开发者文档前年4月更新,不同机型安全区域数值一致,但全面屏机型高度会减少状态栏高度,比如iPhone14 Pro高度变成2436像素。
本题链接: