Skip to content

Instantly share code, notes, and snippets.

@basecss

basecss/html_head.html

Created December 17, 2013 01:13
Show Gist options
  • Save basecss/7998264 to your computer and use it in GitHub Desktop.
Save basecss/7998264 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. basecss created this gist Dec 17, 2013.
    44 changes: 44 additions & 0 deletions html_head.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,44 @@
    <!DOCTYPE html> <!-- HTML5 doctype 不区分大小写 -->
    <html lang="zh-cmn-Hans-CN"> <!-- 更加标准的 lang 属性写法 http://zhi.hu/XyIa -->

    <head>
    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <!-- 优先使用IE最新版本和 Chrome -->

    <!-- width=device-width 会导致 iPhone 5 添加到主屏后以 WebAPP 全屏模式打开页面时出现黑边 http://bigc.at/ios-webapp-viewport-meta.orz -->
    <meta name ="viewport" content ="initial-scale=1.0, maximum-scale=3, minimum-scale=1, user-scalable=no">

    <meta name="apple-mobile-web-app-title" content="标题"> <!-- 添加到主屏时的标题 -->

    <meta name="apple-mobile-web-app-capable" content="yes" /> <!-- 是否启用 WebAPP 全屏模式 -->

    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /> <!-- 状态条颜色 -->

    <meta name="format-detection" content="telephone=no" /> <!-- 屏蔽数字识自动别为电话号码 -->

    <!-- iOS 图标 begin -->
    <!-- 非视网膜 iPhone 低于 iOS 7 -->
    <link rel="apple-touch-icon" href="icon57.png" sizes="57x57">
    <!-- 非视网膜 iPad 低于 iOS 7 -->
    <link rel="apple-touch-icon" href="icon72.png" sizes="72x72">
    <!-- 非视网膜 iPad iOS 7 -->
    <link rel="apple-touch-icon" href="icon76.png" sizes="76x76">
    <!-- 视网膜 iPhone 低于 iOS 7 -->
    <link rel="apple-touch-icon" href="icon114.png" sizes="114x114">
    <!-- 视网膜 iPhone iOS 7 -->
    <link rel="apple-touch-icon" href="icon120.png" sizes="120x120">
    <!-- 视网膜 iPad 低于 iOS 7 -->
    <link rel="apple-touch-icon" href="icon144.png" sizes="144x144">
    <!-- 视网膜 iPad iOS 7 -->
    <link rel="apple-touch-icon" href="icon152.png" sizes="152x152">
    <!-- iOS 图标 end -->

    <meta name="msapplication-TileColor" content="#000"/> <!-- Windows 8 磁贴颜色 -->
    <meta name="msapplication-TileImage" content="icon.png"/> <!-- Windows 8 磁贴图标 -->

    <!-- SEO 优化 -->
    <meta name="description" content="" /> <!-- 页面描述 -->
    <meta name="keywords" content=""/> <!-- 页面关键词 -->
    <title>页面标题</title>
    </head>
    2 changes: 2 additions & 0 deletions reference.md
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,2 @@
    - <http://jinlong.github.io/blog/2013/09/23/safari-ios7-html5-problems-apis-review/>
    - <https://gist.github.com/yisibl/7985401>