-
Notifications
You must be signed in to change notification settings - Fork 72
Guide HTML Structure
Firede edited this page Mar 12, 2014
·
4 revisions
基于 saber 的项目，在 纯移动端网页、移动端 WebApp 的场景下，通常采用以下 HTML 结构：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Title</title>
<!-- 设置 viewport 并且禁止缩放、最小化UI(iOS7.1+) -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
<!-- 禁止自动识别电话号码 -->
<meta name="format-detection" content="telephone=no">
<!-- 添加到主屏幕后，以全屏模式启动应用 -->
<meta name="apple-mobile-web-app-capable" content="yes">
<!-- 在主屏幕启动时，手机状态栏的颜色，请根据应用的设计风格设置 -->
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<!-- 设置添加到主屏幕后的应用图标 -->
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="icon/apple-touch-icon-144x144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="icon/apple-touch-icon-114x114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="icon/apple-touch-icon-72x72-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="icon/apple-touch-icon-57x57-precomposed.png">
<link rel="shortcut icon" sizes="196x196" href="icon/touch-icon-196x196.png">
<link rel="shortcut icon" href="icon/apple-touch-icon.png">
<!-- 引入ESL -->
<script src="http://s1.bdstatic.com/r/www/cache/ecom/esl/1-6-10/esl.js"></script>
<script>
// packages配置，通常由EDP自动生成
require.config({
baseUrl: 'src',
packages: [
]
});
</script>
</head>
<body>
<!-- 主体内容 -->
<script>
// 应用启动入口
require(['app'], function (app) {
app.init();
});
</script>
</body>
</html>以上结构可根据具体场景进行删减。