关于html头部引用(meta,link)
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
/*这一段头部表示 IE浏览器用IE7模拟,IE9还是用IE9来渲染*/
<meta content="IE=EmulateIE7, IE=9" http-equiv="X-UA-Compatible">
/*头部的申明 利于SEO*/
<meta charset="utf-8">/*一般性简写成这样的也就够了*/
<meta content="Apple Inc." name="Author">/*这个是网站的所属标签提示*/
/*可以阻止用户触摸放大屏幕*/
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">/*一般性这种写法就可以了*/
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">/*这种写法更严谨,只是没有必要,效果和上面的一样*/
/*width - viewport的宽度 height - viewport的高度
initial-scale - 初始的缩放比例
minimum-scale - 允许用户缩放到的最小比例
maximum-scale - 允许用户缩放到的最大比例
user-scalable - 用户是否可以手动缩放*/
/*这个是html中写ico的方法,另外js和php后台都可以控制替换最初静态的html中的ico*/
/*其中<link rel="shortcut icon" href="favicon.ico">这段代码最关键*/
<link rel="shortcut icon" href="http://www.luxiw.com/favicon.ico" type="image/vnd.microsoft.icon">
<link rel="icon" href="http://www.luxiw.com/favicon.ico" type="image/vnd.microsoft.icon">
/*底下的代码是在收藏夹中也可以显示图标*/
<link rel="shortcut icon" href="images/favicon.ico">
<link rel="Bookmark" href="images/favicon.ico">
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
第二:微软的老式浏览器(这个可以不用,比较基本没有了。)
<meta name="MobileOptimized" content="320"/>
第三:UC浏览器(市场占有很强势的一个moblie浏览器)
强制竖屏:
<meta name="screen-orientation" content="portrait"/>
强制全屏:
<meta name="full-screen" content="yes"/>
应用模式:
<meta name="browsermode" content="application"/>
QQ浏览器(腾讯的就不多说了,用户群体在那)
强制竖屏:
<meta name="x5-orientation" content="portrait"/>
强制全屏:
<meta name="x5-fullscreen" content="true"/>
应用模式:
<meta name="x5-page-mode" content="app"/>
第四:windows phone 点击无高光
<meta name="msapplication-tap-highlight" content="no"/>
第六:忽略页面中的数字识别为电话号码 还有一个email识别
<meta name="format-detection" content="telephone=no,email=no"/>
第七:是否启动webapp功能,会删除默认的苹果工具栏和菜单栏
<meta name="mobile-webapp-frame-capable" content="yes"/>
第八:当启动webapp功能时,显示手机信号、时间、电池的顶部导航栏的颜色。
<meta name="mobile-webapp-frame-status-bar-style" content="black"/>
<meta name="apple-mobile-web-app-capable" content="yes" />
如何关闭iOS中键盘自动大写
移动版本webkit为input元素提供了autocapitalize属性,通过指定autocapitalize="off"来关闭键盘默认首字母大写
缓存控制
<meta http-equiv="Cache-Control" content="no-cache"/>
<meta http-equiv="Cache-Control" content="max-age=300"/>
<meta http-equiv="Cache-Control" content="max-age=0"/>
HTTP刷新
WAP 浏览器不支持用 <meta/> 标签来控制缓存, 但它们确实知道 HTTP 头 "Cache-Control: no-cache" 的意思. 这种情况下,
解决方案是在服务器端的 HTTP 响应中设置 HTTP 头
<meta http-equiv="Cache-Control" content="no-cache"/>
<meta http-equiv="refresh" content="15"/>
<meta name="apple-touch-fullscreen" content="yes"/>
/*关于标签的问题,每个浏览器可能自己有一套设定的方式,这个就是IOS的document链接地址*/
https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html
<link rel="apple-touch-icon-precomposed" href="这里是你的图片地址" />
<link rel="apple-touch-icon" href="touch-icon-iphone.png" />
<link rel="apple-touch-icon" sizes="72x72" href="touch-icon-ipad.png" />
<link rel="apple-touch-icon" sizes="114x114" href="touch-icon-iphone-retina.png" />
<link rel="apple-touch-icon" sizes="144x144" href="touch-icon-ipad-retina.png" />
<link rel=”dns-prefetch” href=”http://a0.twimg.com”/>
<link rel=”dns-prefetch” href=”http://a2.twimg.com”/>
<link rel=”dns-prefetch” href=”http://a3.twimg.com”/>
<link rel=”dns-prefetch” href=”http://api.twitter.com”/>
最新文章
- JSP模板继承功能实现
- python环境下载地址
- 网页版电子表格控件tmlxSpreadsheet免费下载地址
- (实用篇)PHP定时任务获取微信access_token
- [AaronYang]C#人爱学不学[3]
- [原]ASP.NET 数据库访问通用工具
- 电赛菜鸟营培训(四)&mdash;&mdash;STM32F103CB之ADC转换
- LiveView 0.8 RC1 could boot evidence files acquired from Win10 64bit
- Java学习笔记--NIO
- JAVA车票管理系统(简单GUI)
- 摘抄来自论坛的一些DDD讨论
- tensorflow 从入门到上天教程一
- MySQL之索引详解
- ●CodeForce 293E Close Vertices
- Git如何合并一个已经在GitHub上提交但没有合并的Pull Request请求
- FastDFS api介绍
- AndroidO bluedroid alarm 机制分析
- 在Linux终端安装Julia
- es 测试代码
- Java实现二分法排序