iphone的safari浏览器实现全屏的pwa模式，并修改顶部状态栏背景颜色

要想修改顶部背景颜色，需要用到这个属性：content就是你要设置的颜色


    
    <meta name="theme-color" content="#f8f8f8" />

然后再加上下面的设置：


    
    <meta name="apple-mobile-web-app-capable" content="yes" />
    
    
    <meta name="apple-mobile-web-app-status-bar-style" content="default" />
    <meta name="application-name" content="web独立页面的名称" />

总的设置：


html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    
    <meta name="apple-mobile-web-app-capable" content="yes" />
    
    
    <meta name="apple-mobile-web-app-status-bar-style" content="default" />
    <meta name="application-name" content="web独立页面的名称" />
    
    <link rel="apple-touch-icon-precomposed" sizes="120x120" href="icon.png" />
    
    <meta name="theme-color" content="#fc5531" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <title>收入明细title>
  head>
  <body>
    <div id="app">div>
    <script type="module" src="/src/main.ts">script>
  body>
html>

如果没有设置状态栏背景颜色，可能看到的效果：背景是黑色或者白色

配置好状态栏颜色后：

相关阅读:
【数据结构与算法】并查集
2020-08《信息资源管理 02378》真卷（独家文字版），圈定章节考点+统计真题分布
淘宝店铺所有商品api、店铺商品列表、店铺列表接口
Layui 2.8.0 正式发布，官网全新文档站朴实归来
Android 使用元数据
linux进阶(3)
java中set接口、哈希表、哈希值、HashSet、LinkedHashSet、方法的可变参数
Java游戏核心架构之通信架构
Error:java: 错误: 不支持发行版本 5
计算机网络：3数据链路层

原文地址：https://blog.csdn.net/weixin_44786530/article/details/133122339