HTML页面模板代码

作者声明:本博客中所写的文章,都是博主自学过程的笔记,参考了很多的学习资料,学习资料和笔记会注明出处,所有的内容都以交流学习为主。有不正确的地方,欢迎批评指正

HTML页面模板代码

常用的页面模板

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">

  <link rel="shortcut icon" href="/favicon.ico" />
  <link rel="bookmark" href="/favicon.ico" type="image/x-icon"/>
  <!-- 设置缓存 -->
  <!-- 设定网页的到期时间  -->
  <meta http-equiv="Expires" content="-1">
  <!-- 清除缓存(再访问这个网站要重新下载!) -->
  <meta http-equiv="Cache-Control" content="no-cache">
  <!-- 禁止浏览器从本地机的缓存中调阅页面内容,访问者将无法脱机浏览 -->
  <meta http-equiv="Pragma" content="no-cache">

  <!-- author用于定义网页作者 -->
  <meta name="author" content="aicoder.com">
  <!-- 就是当点击网页添加至主屏幕功能时,会在主屏幕上生成一个图标。点击该图标会进入webapp功能。就是模拟本地应用的模式来浏览web页面。 -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <!-- 当启动webapp功能时,显示手机信号、时间、电池的顶部导航栏的颜色。默认值为default(白色),可以定为black(黑色)和black-translucent(灰色半透明)。这个主要是根据实际的页面设计的主体色为搭配来进行设置。 -->
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <!-- 添加到主屏幕后,app全屏显示 -->
  <meta content="yes" name="apple-touch-fullscreen" />

  <!-- 默认设备会自动识别任何可能是电话和邮箱的字符串。设置telephone=no可以禁用这项功能。 -->
  <meta content="telephone=no,email=no" name="format-detection" />

  <!-- UC浏览器私有 -->
  <!-- 全屏模式 -->
  <meta name="full-screen" content="yes">
  <!-- 应用模式 -->
  <meta name="browsermode" content="application">

  <!-- QQ浏览器私有 -->
  <!-- 全屏模式 -->
  <meta name="x5-fullscreen" content="true">
  <!-- 应用模式 -->
  <meta name="x5-page-mode" content="app">
  <meta name="App-Config" content="fullscreen=yes,useHistoryState=yes,transition=yes" />


  <!-- iOS下页面启动加载时显示的画面图片,避免加载时的白屏。 -->
  <!-- <link rel="apple-touch-startup-image" href="start.png" /> -->

  <!-- 苹果为iOS设备配备了apple-touch-icon私有属性,添加该属性,在iPhone,iPad,iTouch的safari浏览器上可以使用添加到主屏按钮将网站添加到主屏幕上,方便用户以后访问。 -->
  <!-- <link rel="apple-touch-icon" href="/custom_icon.png" /> -->
  <!-- 系统会自动为apple-touch-icon图标添加圆角及高光。如果不想系统对图标添加效果,可以用apple-touch-icon-precomposed代替apple-touch-icon, -->
  <!-- <link href="//gw.alicdn.com/tps/i2/TB1nmqyFFXXXXcQbFXXE5jB3XXX-114-114.png" rel="apple-touch-icon-precomposed"> -->
  <link rel="stylesheet" href="./lib/swiper/css/swiper.min.css">
  <link rel="stylesheet" href="./font/font-shop/iconfont.css">
  <link rel="stylesheet" href="./css/common.css">
  <link rel="stylesheet" href="./css/index.css">
  <script src="./js/rem.js"></script>
  <title>优选网</title>
</head>

<body>
  
</body>

</html>

猜你喜欢

转载自www.cnblogs.com/NightTiger/p/10259122.html
今日推荐