移动端meta设置

182 阅读1分钟
<!DOCTYPE html>
<html lang="">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <link rel="icon" href="<%= BASE_URL %>favicon.ico">
  <!-- <title><%= htmlWebpackPlugin.options.title %></title> -->
  <title>我的企业</title>
  <meta name="applicable-device" content="mobile" />
  <!-- iphone会把一串数字识别为电话号码,点击的时候会提示是否呼叫,屏蔽这功能则把telephone设置为no -->
  <meta content="telephone=no" name="format-detection" />
  <!-- iphone的私有标签,默认值为default(白色),可以定为black(黑色)和black-translucent(灰色半透明) -->
  <meta content="black" name="apple-mobile-web-app-status-bar-style" />
  <!-- iphone设备的是有标签 允许全屏模式浏览,隐藏浏览器导航栏 -->
  <meta content="yes" name="apple-mobile-web-app-capable" />
  <!-- 全屏显示 -->
  <meta content="yes" name="apple-touch-fullscreen" />
  <!-- UC强制全屏 -->
  <meta name="full-screen" content="yes" />
  <!-- QQ强制全屏 -->
  <meta name="x5-fullscreen" content="true" />
  <!-- 移动端 浏览器中页面将以原始大小显示,不允许缩放 -->
  <meta name="viewport"
    content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no, viewport-fit=cover" />
  <!-- 屏蔽百度转码 -->
  <meta http-equiv="Cache-Control" content="no-transform" />
  <meta http-equiv="Cache-Control" content="no-siteapp" />
</head>

<body>
  <noscript>
    <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
        Please enable it to continue.</strong>
  </noscript>
  <div id="app"></div>
</body>

</html>