天天看点

HTML5----移动head,meta标签属

移动head,meta标签属

<!doctype html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">	 <!-- 优先使用 IE 最新版本和 Chrome -->
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Expires" content="0">

<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui">
			width,height : viewport 高度
			[initial-scale=1.0] 初始缩放比例
			[maximum-scale=1.0] 最大缩放比例
			[minimum-scale=1.0] 最小缩放比例
			[user-scalable=no ] 是否允许用户缩放(yes/no)
			[minimal-ui]        IOS7.1beta 新增,IOS8已经删除
	
			<meta name="viewport" content="width=375">
			4.7~5:    width=360
			note 5.5: width=400		
			iphone6:  width=375
			iphone6s: widht=414
		
<meta name="apple-mobile-web-app-capable" content="yes"> 							<!-- 是否启用 WebApp 全屏模式 -->
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">		<!-- 设置状态栏的背景颜色,只有在 `"apple-mobile-web-app-capable" content="yes"` 时生效 -->
		    content=[default(默认), black, black-translucent(黑色半透明)]
<meta name="format-detection" content="telephone=no, email=no">   <!-- 忽略页面中的数字识别为电话,忽略email识别 -->
<meta name="renderer" content="webkit"> <!-- 启用360浏览器的极速模式(webkit) -->
<meta name="HandheldFriendly" content="true"> <!-- 针对手持设备优化,主要是针对一些老的不识别viewport的浏览器,比如黑莓 -->
<meta name="MobileOptimized" content="320">   <!-- 微软的老式浏览器 -->
<meta name="msapplication-tap-highlight" content="no">  <!-- windows phone 点击无高光 -->
<meta name="screen-orientation" content="portrait"> <!-- UC强制竖屏 --> 
<meta name="full-screen" content="yes">  			<!-- UC强制全屏 --> 
<meta name="browsermode" content="application">     <!-- UC应用模式 -->
<meta name="x5-orientation" content="portrait">  	<!-- QQ强制竖屏 --> 
<meta name="x5-fullscreen" content="true"> 			<!-- QQ强制全屏 -->
<meta name="x5-page-mode" content="app">            <!-- QQ应用模式 -->

<meta name="Description" content="深圳首家知名教育机构,专注于成人学历教育提升和职业能力培养。服务电话:400-1112-888" />
 
 <!--other-->
 <meta name="keywords" content=""/>
 <meta name="author" content="damys, [email protected]"/>
 <meta name="robots" content="index,follow"/>				<!-- 搜索引擎抓取 -->
 
 
 <meta name="apple-mobile-web-app-title" content="标题"> <!--IOS6 新增--> 
 <!--iOS 图标--> rel 参数: apple-touch-icon 图片自动处理成圆角和高光等效果。 apple-touch-icon-precomposed 禁止系统自动添加效果,直接显示设计原图
 <link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-57x57-precomposed.png" target="_blank" rel="external nofollow"  /> <!-- iPhone 和 iTouch,默认 57x57 像素,必须有 -->
 <link rel="apple-touch-icon-precomposed" sizes="72x72" href="/apple-touch-icon-72x72-precomposed.png" target="_blank" rel="external nofollow"  /> <!-- iPad,72x72 像素,可以没有,但推荐有 -->
 <link rel="apple-touch-icon-precomposed" sizes="114x114" href="/apple-touch-icon-114x114-precomposed.png" target="_blank" rel="external nofollow"  /> <!-- Retina iPhone 和 Retina iTouch,114x114 像素,可以没有,但推荐有 -->
 <link rel="apple-touch-icon-precomposed" sizes="144x144" href="/apple-touch-icon-144x144-precomposed.png" target="_blank" rel="external nofollow"  /> <!-- Retina iPad,144x144 像素,可以没有,但推荐有 -->
 <link rel="apple-touch-icon-precomposed" sizes="180x180" href="retinahd_icon.png" target="_blank" rel="external nofollow" > <!--iPhone 6 plus上是180×180,iPhone 6 是120×120-->
 
 <!--IOS启动画面-->
 <link rel="apple-touch-startup-image" sizes="768x1004" href="/splash-screen-768x1004.png" target="_blank" rel="external nofollow"  /> <!-- iPad 竖屏 768 x 1004(标准分辨率) -->
 <link rel="apple-touch-startup-image" sizes="1536x2008" href="/splash-screen-1536x2008.png" target="_blank" rel="external nofollow"  /> <!-- iPad 竖屏 1536x2008(Retina) -->
 <link rel="apple-touch-startup-image" sizes="1024x748" href="/Default-Portrait-1024x748.png" target="_blank" rel="external nofollow"  /> <!-- iPad 横屏 1024x748(标准分辨率) -->
 <link rel="apple-touch-startup-image" sizes="2048x1496" href="/splash-screen-2048x1496.png" target="_blank" rel="external nofollow"  /> <!-- iPad 横屏 2048x1496(Retina) -->
 <link rel="apple-touch-startup-image" href="/splash-screen-320x480.png" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  /> <!-- iPhone/iPod Touch 竖屏 320x480 (标准分辨率) -->
 <link rel="apple-touch-startup-image" href="/splash-screen-320x480.png" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  /> <!-- iPhone/iPod Touch 竖屏 320x480 (标准分辨率) -->
 <link rel="apple-touch-startup-image" sizes="640x960" href="/splash-screen-640x960.png" target="_blank" rel="external nofollow"  /> <!-- iPhone/iPod Touch 竖屏 640x960 (Retina) -->
 <link rel="apple-touch-startup-image" sizes="640x1136" href="/splash-screen-640x1136.png" target="_blank" rel="external nofollow"  /> <!-- iPhone 5/iPod Touch 5 竖屏 640x1136 (Retina) -->
 <link rel="apple-touch-startup-image" href="launch6.png" target="_blank" rel="external nofollow"  media="(device-width: 375px)">
 <link rel="apple-touch-startup-image" href="launch6plus.png" target="_blank" rel="external nofollow"  media="(device-width: 414px)">
 <meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL"> <!-- 添加智能 App 广告条 Smart App Banner(iOS 6+ Safari) -->
 
 <!--Android-->Chrome 39 增加 theme-color meta 标签
 <meta name="theme-color" content="#db5945">
 <meta name="msapplication-TileColor" content="#000"/> <!-- Windows 8 磁贴颜色 -->
 <meta name="msapplication-TileImage" content="icon.png"/> <!-- Windows 8 磁贴图标 -->
 <link rel="alternate" type="application/rss+xml" title="RSS" href="/rss.xml" target="_blank" rel="external nofollow"  /> <!-- 添加 RSS 订阅 -->
 <link rel="shortcut icon" type="image/ico" href="/favicon.ico" target="_blank" rel="external nofollow"  /> <!-- 添加 favicon icon -->
 <meta name="google" value="notranslate" /> <!--禁用翻译插件-->
 
 <title>移动Head meta 标签</title>
</head>
           

继续阅读