uniapp开发app苹果黑边

在Uniapp开发中，苹果设备上出现黑边的问题可以通过以下方法解决。

首先，在manifest.json文件中找到"app-plus"字段，添加以下配置来去除底部的安全区域和底部的白边：

"app-plus": {
  "safearea": {
    "bottom": {
      "offset": "none"
    }
  }
}

这样配置后，底部的安全区域将不再空出，并且底部的白边也会被去除。请注意，这个配置只在iOS平台上生效。

另外，如果在iOS设备上设置了启动图后，屏幕的上下方仍然出现黑边，可以通过在CSS中给中间内容部分添加以下样式来解决：

padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);

这样设置后，页面的中间内容部分会根据设备的安全区域自动添加底部的间隔，以适应不同的设备屏幕。请注意，这个样式需要注意前后顺序。

通过以上配置和样式，你应该能够解决Uniapp开发中苹果设备上出现黑边的问题。希望能对你有所帮助。<span class="em">1</span><span class="em">2</span>
#### 引用[.reference_title]
- *1* [uni-app打包成ios app常见问题](https://blog.csdn.net/qq_46591275/article/details/125976185)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
- *2* [uniapp小程序—适配ios底部小黑条](https://blog.csdn.net/hzqzzz/article/details/127126115)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]