html中的meta详解
1 name=viewport
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
1、width : 控制viewport的大小，可以指定一个值，如600， 或者特殊的值，如device-width为设备的宽度（单位为缩放为100%的CSS的像素）
2、height : 和width相对应，指定高度
3、initial-scale : 初始缩放比例，页面第一次加载时的缩放比例
4、maximum-scale : 允许用户缩放到的最大比例，范围从0到10.0
5、minimum-scale : 允许用户缩放到的最小比例，范围从0到10.0
6、user-scalable : 用户是否可以手动缩放，值可以是：①yes、 true允许用户缩放；②no、false不允许用户缩放
2 meta中的name属性
<!--用以说明生成工具--> <meta name="Generator" content=""> <!--向搜索引擎说明你的网页的关键词--> <meta name="Keywords" content=""> <!-- 告诉搜索引擎你的站点的主要内容--> <meta name="Description" content=""> <!-- 告诉搜索引擎你的站点的制作的作者 --> <meta name="Author" content="你的姓名"> <meta name="Robots" content= "all|none|index|noindex|follow|nofollow"> <!-- 设定为all：文件将被检索，且页面上的链接可以被查询； 设定为none：文件将不被检索，且页面上的链接不可以被查询； 设定为index：文件将被检索； 设定为follow：页面上的链接可以被查询； 设定为noindex：文件将不被检索，但页面上的链接可以被查询； 设定为nofollow：文件将不被检索，页面上的链接可以被查询。 -->
3 meta中的 http-equiv属性
<!--设置字符编码和文件格式--> <meta http-equiv="Content-Type" content="text/html";charset=utf-8"> <!--设置定时刷新--> <meta http-equiv="Refresh" content="n;url=http://.......> <!-- 告诉浏览器不要缓存页面--> <meta http-equiv="Pragma" content="no-cache"> <! -- //告诉浏览器不要缓存页面--> <meta http-equiv="cache-control" content="no-cache">//告诉浏览器不要缓存页面 <!--禁用浏览器缓存此页面--> <meta http-equiv="expires" content="0"> <!--设置ie的文档兼容模式,设置IE7+的浏览器以IE7的兼容模式查看页面--> <meta http-equiv="X-UA-Compatible" content="IE=7">
4 html5中更多的meta与link
<!DOCTYPE html> <!-- HTML5 doctype 不区分大小写 --> <html lang="zh"> <!-- 更加标准的 lang 属性写法 http://zhi.hu/XyIa --> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <!-- 优先使用IE最新版本和 Chrome --> <meta name="renderer" content="webkit|ie-comp|ie-stand"> <!-- 360 浏览器内核控制 --> <!-- content的取值为webkit,ie-comp,ie-stand之一，区分大小写，分别代表用webkit内核，IE兼容内核，IE标准内核。 若页面需默认用极速核，增加标签：<meta name="renderer" content="webkit"> 若页面需默认用ie兼容内核，增加标签：<meta name="renderer" content="ie-comp"> 若页面需默认用ie标准内核，增加标签：<meta name="renderer" content="ie-stand"> --> <!-- width=device-width 会导致 iPhone 5 添加到主屏后以 WebAPP 全屏模式打开页面时出现黑边 http://bigc.at/ios-webapp-viewport-meta.orz --> <meta name ="viewport" content ="initial-scale=1.0, maximum-scale=3, minimum-scale=1, user-scalable=no"> <meta name="apple-mobile-web-app-title" content="标题"> <!-- 添加到主屏时的标题 --> <meta name="apple-mobile-web-app-capable" content="yes" /> <!-- 是否启用 WebAPP 全屏模式 --> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /> <!-- 状态条颜色 --> <meta name="format-detection" content="telephone=no" /> <!-- 屏蔽数字自动识别为电话号码 --> <!-- favicon 图标 --> <link type="image/x-icon" rel="icon" href="http://static.example.com/favicon.ico"/> <link type="image/x-icon" rel="shortcut icon" href="http://static.example.com/favicon.ico"/> <link type="image/x-icon" rel="bookmark" href="http://static.example.com/favicon.ico"/> <!-- iOS 图标 begin --> <!--默认 57x57 像素--> <link rel="apple-touch-icon-precomposed" href="http://wanke.etao.com/assets/img/icon/57/apple-touch-icon-57x57-precomposed.png" /> <!--iPad 1 72x72 像素--> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="http://wanke.etao.com/assets/img/icon/72/apple-touch-icon-72x72-precomposed.png" /> <!--iPhone 4 114x114 像素--> <link rel="apple-touch-icon-precomposed" sizes="114x114" href="http://wanke.etao.com/assets/img/icon/114/apple-touch-icon-114x114-precomposed.png" /> <!-- iOS 图标 end --> <meta name="msapplication-TileColor" content="#000"/> <!-- Windows 8 磁贴颜色 --> <meta name="msapplication-TileImage" content="icon.png"/> <!-- Windows 8 磁贴图标 --> <!-- SEO 优化 --> <meta name="description" content="" /> <!-- 页面描述 --> <meta name="keywords" content=""/> <!-- 页面关键词 --> <title>页面标题</title> <!-- iOS 应用启动界面设置 begin --> <!-- iPad Landscape – 1024 x 748 --> <link rel="apple-touch-startup-image" sizes="1024x748" href="img/splash-screen-1024x748.png" /> <!-- iPad Portrait – 768 x 1004 --> <link rel="apple-touch-startup-image" sizes="768x1004" href="img/splash-screen-768x1004.png" /> <!-- iPhone/iPod Touch Portrait – 320 x 480 (standard resolution) --> <link rel="apple-touch-startup-image" href="img/splash-screen-320x480.png" /> <!-- iPhone/iPod Touch Portrait – 640 x 960 pixels (high-resolution) --> <link rel="apple-touch-startup-image" sizes="640x960" href="img/splash-screen-640x960.png" /> <!-- iOS 应用启动界面设置 end --> </head>
html中的meta详解的更多相关文章
- Model中内部类meta详解
Django 模型类的Meta是一个内部类,它用于定义一些Django模型类的行为特性. 以下对此作一总结: Model 元数据就是 "不是一个字段的任何数据" -- 比如排序选项 ...
- 【微信小程序项目实践总结】30分钟从陌生到熟悉 web app 、native app、hybrid app比较 30分钟ES6从陌生到熟悉 【原创】浅谈内存泄露 HTML5 五子棋 - JS/Canvas 游戏 meta 详解，html5 meta 标签日常设置 C#中回滚TransactionScope的使用方法和原理
[微信小程序项目实践总结]30分钟从陌生到熟悉 前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05- ...
- Django model 中的 class Meta 详解
Django model 中的 class Meta 详解 通过一个内嵌类 "class Meta" 给你的 model 定义元数据, 类似下面这样: class Foo(mode ...
- 【JavaScript中的this详解】
前言 this用法说难不难,有时候函数调用时,往往会搞不清楚this指向谁?那么,关于this的用法,你知道多少呢? 下面我来给大家整理一下关于this的详细分析,希望对大家有所帮助! this指向的 ...
- JavaScript中的this详解
前言 this用法说难不难,有时候函数调用时,往往会搞不清楚this指向谁?那么,关于this的用法,你知道多少呢? 下面我来给大家整理一下关于this的详细分析,希望对大家有所帮助! this指向的 ...
- html5中output元素详解
html5中output元素详解 一.总结 一句话总结: output元素是HTML5新增的元素,用来设置不同数据的输出,没什么大用,了解即可 <form action="L3_01. ...
- html5中time元素详解
html5中time元素详解 一.总结 一句话总结: time的使用的话主要是将时间放在datetime属性里面:<time datetime="2015-10-22"> ...
- php中关于引用(&)详解
php中关于引用(&)详解 php的引用(就是在变量或者函数.对象等前面加上&符号) 在PHP 中引用的意思是:不同的变量名访问同一个变量内容. 与C语言中的指针是有差别的．C语言中的 ...
- JavaScript正则表达式详解（二）JavaScript中正则表达式函数详解
二.JavaScript中正则表达式函数详解(exec, test, match, replace, search, split) 1.使用正则表达式的方法去匹配查找字符串 1.1. exec方法详解 ...
随机推荐
- C++ 面试 （1） 指针
指针是C++中一类颇具特色的数据类型,允许直接操作内存地址,实现内存的动态分配.指针问题通常包括指针常量,常量指针,数组指针,指针数组,函数指针,指针传值等. 指针和引用的区别 非空区别.在任何情况下 ...
- 利用jquery.validate以及bootstrap的tooltip开发气泡式的表单校验组件
表单校验是页面开发中非常常见的一类需求,相信每个前端开发人员都有这方面的经验.网上有很多成熟的表单校验框架,虽然按照它们默认的设计,用起来没有多大的问题,但是在实际工作中,表单校验有可能有比较复杂的个 ...
- MyEclipse 2014 GA 和 MyEclipse 2015 CI 和 Eclipse Luna 最新最全下载地址
官方下载地址: Eclipse 标准版 x86 http://mirror.hust.edu.cn/eclipse//technology/epp/downloads/release/luna/R/e ...
- 【C#】New操作符所做的事情
1.它计算类型以及所有基类型(一直到System.Object,虽然它没有定义自己的实例字段)中定义的所有实例字段需要的字节数.堆上的每个对象都需要一些额外的成员---即“类型对象指针”和“同步块索引 ...
- CSS侧边栏，ng-click定义选中事件
本篇小随笔,记录下侧边栏的写法和ng-click点击选中事件.因为这个工程不让引用jQuery.所以ng-click选中事件用了一个比较笨的方法实现的. 下面是HTML页面 按 Ctrl+C 复制代码 ...
- jquery改变文本框颜色
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Python默认版本修改
Python默认版本修改 当电脑安装了多个版本的Python,而Shell中默认的Python不是你想要的,这个时候就需要对Python的默认版本进行修改. 在Windows中,可以通过修改环境变量的 ...
- 22、ASP.NET MVC入门到精通——搭建项目框架
本系列目录:ASP.NET MVC4入门到精通系列目录汇总 前面的章节,说了ASP.NET MVC项目中常用的一些技术和知识点,更多的是理论上面的东西,接下来,我将通过一个简单的OA项目来应用我们之前 ...
- [ASP.NET MVC] ASP.NET Identity登入技术剖析
[ASP.NET MVC] ASP.NET Identity登入技术剖析 前言 ASP.NET Identity是微软所贡献的开源项目,用来提供ASP.NET的验证.授权等等机制.本篇文章介绍ASP. ...
- webpack继续
序言:继续上一篇<webpack初入> 1.上一篇配置完成后最终的命令是:webpack,如果更改package.json中的一个配置如下: 换为 此时最终的命令:npm start等同于 ...