H5常用代码:页面框架

万变不离其宗,道法自然!

虽然H5的小项目一波又一波,但有一个东东基本没什么变化,那就是整个页面的框架结构。

我所常用的H5常用页面框架如下:

DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <meta content="email=no" name="format-detection">
  
<title>主结构title> head> <body> 页面内容页面内容
  
body> html>

meta设置部分:

viewport设置为屏幕的宽度,禁用缩放

apple-mobile-web-app-capable:当网站添加到主屏幕快速启动方式,可隐藏地址栏,仅针对ios的safari

apple-mobile-web-app-status-bar-style:将网站添加到主屏幕快速启动方式,仅针对ios的safari顶端状态条的样式

telephone=no:禁用自动识别手机号

email=no:禁用自动识别邮箱

样式JS引入:

head部分link方式引入样式

body尾部引入JS

以上代码归属于我的github常用H5代码整理项目(详见其中template):https://github.com/xw5/mobile-code/

欢迎clone,欢迎star,一起学习,一起进步

转载于:https://www.cnblogs.com/xwwin/p/5769381.html

你可能感兴趣的:(H5常用代码:页面框架)