html<head><meta>部分属性

来源：互联网发布：mac 手机远程控制编辑：程序博客网时间：2024/04/30 23:31

meta是一个单标签，属性意义及作用如下：

1、viewport让网页开发者来控制移动端窗口（viewport ）的大小和缩放。

width：控制 viewport 的大小，可以指定的一个值，如果 600，或者特殊的值，如 device-width 为设备的宽度（单位为缩放为 100% 时的 CSS 的像素）。
height：和 width 相对应，指定高度。
initial-scale：初始缩放比例，也即是当页面第一次 load 的时候缩放比例。
maximum-scale：允许用户缩放到的最大比例。
minimum-scale：允许用户缩放到的最小比例。
user-scalable：用户是否可以手动缩放
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
这段代码的意思是，让viewport的宽度等于物理设备上的真实分辨率，不允许用户缩放。

2、http-equiv顾名思义，相当于http的文件头作用，它可以向浏览器传回一些有用的信息，以帮助正确和精确地显示网页内容。与之对应的属性值为content，content中的内容其实就是各个参数的变量值。

Refresh(刷新) ：自动刷新并指向新页面。
＜meta http-equiv="Refresh" content="2；URL=http://www.net.cn/"＞
其中的2是指停留2秒钟后自动刷新到URL网址。
Set-Cookie(cookie设定) ：如果网页过期，那么存盘的cookie将被删除。
＜meta http-equiv="Set-Cookie" content="cookievalue=xxx;expires=Wednesday, 20-Jun-2007 22:33:00 GMT； path=/"＞

content-Type(显示字符集的设定) ：设定页面使用的字符集。

＜meta http-equiv="content-Type" content="text/html; charset=gb2312"＞

清除缓存。
<meta http-equiv="cache-control" content="no-cache">
忽略页面中的数字识别为电话，忽略email识别。
<metaname="format-detection"content="telphone=no, email=no" />
关于applicable-device属性，适配相关：
如果网页采用了响应式网页设计，例如（cdc.tencent.com）不需要经过url自适配跳转就可以根据浏览器的屏幕大小自适应的展现合适的效果，同时适合在移动设备和电脑上进行浏览，在html中加入如下meta：
<meta name="applicable-device"content="pc,mobile">
这个meta标签，表示页面同时适合在移动设备和PC上进行浏览。
响应式设计对站点服务器带宽有高要求，因为通过css隐藏的html内容同样会造成带宽浪费。

3、百度协助适配：

<meta name="mobile-agent"content="format=[wml|xhtml|html5]; url=url">（新写法，老写法为：2——http-equiv）
[wml|xhtml|html5]——根据手机页的协议语言，选择中的一种。
url=url ——后者代表当前PC页所对应的手机页url，两者必须是一一对应关系（而不是统一对应至手机站首页）
<meta name="mobile-agent" content="format=html5;url=http://3g.sina.com.cn/">
参考：http://blog.csdn.net/zerlinda_c/article/details/50345627

另外还有，描述、关键字。

阅读全文

0 0