关于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”/>
关于html头部引用(meta,link)的更多相关文章
- HTML 头标签的 <title> <base> <meta> <link> <script> 的内容意思
头标签都放在<head></head>头部分之间.包括:title base meta link <title>:指定浏览器的.(标题) <base>: ...
- html学习笔记 - meta link
<!DOCTYPE html> <html lang="en"> <head> <!-- 编码格式 --> <meta cha ...
- 【转】头部属性 Meta http-equiv 大全
http-equiv类似于HTTP的头部协议,它回应给浏览器一些有用的信息,以帮助正确和精确地显示网页内容.常用的http-equiv类型有: 1.Content-Type和Content-Langu ...
- html5手机网站需要加的那些meta/link标签,html5 meta全解
原文链接:http://blog.csdn.net/kongjiea/article/details/17092413(收藏专用!如需转载,请点击链接,联系博主,获得同意后方可转载) 3.name之设 ...
- css的两种引用方式 link和@import
学习web开发的最大乐趣就是不断的发现自己以前不曾见过的东西,这些东西对于我来说是那么的新鲜有趣. 比如说今天偶尔研究别人的网站,就发现了有趣的东东. 当点开此网页的css时(这个css文件命名方式就 ...
- 移动端<head>头部 常用<meta>标签
<!DOCTYPE html><html lang = ""><head> <title></title> <me ...
- 移动端head头部常用meta标签
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum- ...
- php获取json文件数据并动态修改网站头部文件meta信息 --基于CI框架
话不多说了.直接开始吧 (如果有中文.请注意json只认utf-8编码) 首先你需要有一个json文件数据 { "index": { ...
- 关于jQuery插件imgAreaSelect基础讲解
关于ImgAreaSelect, 是一jQuery插件,它支持用户通过鼠标拖曳选择图片的一部分,如图片拖曳.图片编辑等~~来具体看一下 1.先下载imgAreaSelect插件 下载地址: 英文:h ...
随机推荐
- oracle 清空数据库缓存
oracle 清除数据库缓存: alter system flush shared_pool ; alter system flush BUFFER_CACHE ;
- CSS文档优化
首先了解下CSS的渲染逻辑,它是从标记的最后一位开始搜索的,例如:.myclass li a,首选它会遍历所有的<a>,然后看哪些<a>之前有<li>,然后再看哪些 ...
- php 01
PHP 一.了解php 1.什么是php PHP 超文本预处理器 服务器端的脚本语言 是一种被广泛应用的开放源代码的多用途脚本语言 他可以嵌入到html中 尤其适用web开发 2.php在web中 ...
- stm8 全局变量定义 声明
1.ST Visual Develop 开发环境下.h文件里面不能定义变量,要把变量定义在.C文件里面,然后在.H文件里面声明即可.补充:今天突然发现还有一种情况,变量在一个.h文件里定义后,在另外的 ...
- 05、Win7上openSSH的安装与配置
05.Win7上openSSH的安装与配置 1.概述 linux上的ssh命令在网络通信场景下非常方便.现在windows也支持ssh方式和远程主机进行访问.如果只是使用ssh简单的访问功能,就需要很 ...
- hdu-2680 Choose the best route---dijkstra+反向存图或者建立超级源点
题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=2680 题目大意: 给你一个有向图,一个起点集合,一个终点,求最短路 解题思路: 1.自己多加一个超级 ...
- 【BZOJ3930】[CQOI2015] 选数(容斥)
点此看题面 大致题意: 让你求出在区间\([L,H]\)间选择\(n\)个数时,有多少种方案使其\(gcd\)为\(K\). 容斥 原以为是一道可怕的莫比乌斯反演题. 但是,数据范围中有这样一句话:\ ...
- 【BZOJ1925】 [SDOI2010] 地精部落(带有一堆性质的动态规划)
点此看题面 大致题意: 问你有多少长度为\(n\)的数列,它当中每个数字要么比旁边两个数字都小,要么比旁边两个数字都大. 性质 这题应该比较显然是一道动态规划题,但刚看到这题时我却无从下手. 其实,了 ...
- .NET AJAX实例
引用地址:http://blog.csdn.net/qianjiu/article/details/7524228 5.2 Ajax基础http://book.csdn.net/bookfiles/6 ...
- Java基础面试操作题: 获取 1-20 之间的随机数,共计 20 个,要求不能重复 获取 1-20 之间的随机数,共计 10 个,要求不能重
package com.swift; import java.util.HashSet; import java.util.Random; import java.util.Set; public c ...