html5教程

dhso
2016/12/13 10:45
统计中

文档类型声明

<!DOCTYPE HTML>

H5 meta全解

声明文档使用的字符编码

<meta charset='utf-8'>

优先使用 IE 最新版本和 Chrome

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>

页面描述

<meta name="description" content="不超过150个字符"/>

页面关键词

####屏幕的缩放 `` ``` width viewport的宽度[device-width | pixel_value]width如果直接设置pixel_value数值,大部分的安卓手机不支持,但是ios支持;

height viewport 的高度 (范围从 223 到 10,000 )

user-scalable [yes | no]是否允许缩放

initial-scale [数值] 初始化比例(范围从 > 0 到 10)

minimum-scale [数值] 允许缩放的最小比例

maximum-scale [数值] 允许缩放的最大比例

target-densitydpi 值有以下(一般推荐设置中等响度密度或者低像素密度,后者设置具体的值dpi_value,另外webkit内核已不准备再支持此属性)
-- dpi_value 一般是70-400//没英寸像素点的个数
-- device-dpi设备默认像素密度
-- high-dpi 高像素密度
-- medium-dpi 中等像素密度
-- low-dpi 低像素密度

####忽略电话号码和邮箱
`<meta name="format-detection" content="telphone=no, email=no"/>`
####设置作者姓名及联系方式
`<meta name="author" contect="hadong, dhso@163.com" />`
####搜索引擎抓取
`<meta name="robots" content="index,follow"/>`
####启用360浏览器的极速模式(webkit)
`<meta name="renderer" content="webkit">`
####避免IE使用兼容模式
`<meta http-equiv="X-UA-Compatible" content="IE=edge">`
####不让百度转码
`<meta http-equiv="Cache-Control" content="no-siteapp" />`
####针对手持设备优化,主要是针对一些老的不识别viewport的浏览器,比如黑莓
`<meta name="HandheldFriendly" content="true">`
####微软的老式浏览器
`<meta name="MobileOptimized" content="320">`
####UC强制竖屏
`<meta name="screen-orientation" content="portrait">`
####UC强制全屏
`<meta name="full-screen" content="yes">`
####UC应用模式
`<meta name="browsermode" content="application">`
####QQ强制竖屏
`<meta name="x5-orientation" content="portrait">`
####QQ应用模式
`<meta name="x5-page-mode" content="app">`
####添加 RSS 订阅 
`<link rel="alternate" type="application/rss+xml" title="RSS" href="/rss.xml"/>`
####添加 favicon icon
`<link rel="shortcut icon" type="image/ico" href="/favicon.ico"/>`
####SNS 社交标签
``` ####Windows 8 磁贴颜色 `` ####Windows 8 磁贴图标 `` ####windows phone 点击无高光 `` ####IOS 开启全屏显示 `` ####IOS 改变顶部状态条的颜色 ``` 在 web app 应用下状态条(屏幕顶部条)的颜色, 默认值为 default(白色),可以定为 black(黑色)和 black-translucent(灰色半透明); ``` ####Safari 设置'添加到主屏幕图标' `` ####Safari 设置桌面图标的标题 `` ####判断浏览器 ``` ``` ###H5 在移动应用开发的总结 ![H5在移动应用开发的总结](/content/images/2016/12/image001.png) **[转到网易UEDC](http://uedc.163.com/7136.html)** ###H5 一些移动应用框架 >* **[MUI-最接近原生APP体验的高性能前端框架](http://dev.dcloud.net.cn/mui/)**

mui

MUI DEMO

ionicframework

Jingle

sui

framework7

本文为 dhso 原创

发布在 http://blog.minws.com/html5jiao-cheng/

如有转载,请标明来源!

作者信息
姓名:dhso
热评文章
最新评论
文章概览