自动刷新并指向新的页面
实现网页转换时的动态效果
控制页面缓冲
网页定级评价
控制网页显示的窗口
一、meta标签的属性
1、charset属性
该特性申明文档的字符编码但,该声明可以被任何一个元素的 lang 特性的值覆盖。推荐使用utf-8国际通用编码。如:
<meta charset="utf-8">
登录后复制
2、content属性
此属性包含http-equiv 或name 属性的值,具体取决于所使用的值。
3、http-equiv属性
这个枚举属性定义了能改变服务器和用户引擎行为的编译。这个编译值使用content 来定义,如下:
content-language(过时)
指定页面的默认语言,推荐使用<html>设置全局lang属性来代替。
content-security-policy:内容安全策略
它允许页面作者定义当前页的 内容策略。 内容策略主要指定允许的服务器源和脚本端点,这有助于防止跨站点脚本攻击。
content-type(过时)
设置文档字符编码,推荐使用meat的charset属性代替。
default-style:默认样式(首选样式)
该属性指定了文档首选的默认样式。content的值必须包含link元素的标题、href属性链接到CSS样式表或包含CSS样式表的``元素的标题。
refresh:页面刷新时间
如果content值为正整数,则设置为指定时间间隔刷新当前页面,值为正整数后跟字符串的形式则指定时间间隔内跳转到指定页面。以上时间单位为秒。
<!-- Redirect page after 3 seconds -->
<meta http-equiv="refresh" content="3url=http://www.cnblogs.com/fzz9/">
<meta http-equiv="refresh" content="3 <http://www.cnblogs.com/fzz9/>">
登录后复制
set-cookie(过时)
为页面设置cookie,请改用HTTP的Set-Cookie头部。
4、name属性
该属性定义文档级元数据的名称。如果以下其中一个属性设置了itemprop, http-equiv or charset ,就不能再设置这个属性了。
name属性可包含以下值(不完整):
application-name
定义正运行在该网页上的网络应用名称。
author
文档的作者名称,自由格式。
description
其中包含页面内容的简短和精确的描述。 一些浏览器,如Firefox和Opera,将其用作书签页面的默认描述。
generator
包含生成页面的软件的标示符。
keywords
包含与逗号分隔的页面内容相关的单词。
referrer(实验中的属性)
控制所有从该文档发出的 HTTP 请求中HTTP Referer首部的内容。
creator
定义文档创建者的名称,与author类似。
googlebot
属性robots的同义词,该属性只有googleBot(谷歌索引抓取工具)才会使用。
publisher
自由格式定义文档发布者的名称。
robots
定义搜索引擎爬虫与页面应具有的行为。 它是以逗号分隔的值列表,可选值:
Untitled
viewport(供移动设备使用)
该属性提供有关视口初始大小的提示,仅供移动设备使用。
可选值为:
Untitled
我们常使用下面这个设置来适配移动端页面:
<meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
登录后复制
二、meta标签的实际使用
1、各大网站首页的meta
我们可以从各大网站的页面查看他们对meta的使用,比如:
淘宝首页
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="renderer" content="webkit">
<meta name="spm-id" content="a21bo">
<meta name="description" content="淘宝网 - 亚洲较大的网上交易平台,提供各类服饰、美容、家居、数码、话费/点卡充值… 数亿优质商品,同时提供担保交易(先收货后付款)等安全交易保障服务,并由商家提供退货承诺、破损补寄等消费者保障服务,让你安心享受网上购物乐趣!">
<meta name="aplus-xplug" content="NONE">
<meta name="keyword" content="淘宝,掏宝,网上购物,C2C,在线交易,交易市场,网上交易,交易市场,网上买,网上卖,购物网站,团购,网上贸易,安全购物,电子商务,放心买,供应,买卖信息,网店,一口价,拍卖,网上开店,网络购物,打折,免费开店,网购,频道,店铺">
微博首页
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="initial-scale=1,minimum-scale=1">
<meta content="随时随地发现新鲜事!微博带你欣赏世界上每一个精彩瞬间,了解每一个幕后故事。分享你想表达的,让全世界都能听到你的心声!" name="description">
github首页
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta name="description" content="GitHub is where people build software. More than 36 million people use GitHub to discover, fork, and contribute to over 100 million projects.">
<meta property="fb:app_id" content="1401488693436528">
<meta property="og:url" content="<https://github.com>">
<meta property="og:site_name" content="GitHub">
<meta property="og:title" content="Build software better, together">
<meta property="og:description" content="GitHub is where people build software. More than 36 million people use GitHub to discover, fork, and contribute to over 100 million projects.">
<meta property="og:image" content="<https://github.githubassets.com/images/modules/open_graph/github-logo.png>">
<meta property="og:image:type" content="image/png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="1200">
<meta property="og:image" content="<https://github.githubassets.com/images/modules/open_graph/github-mark.png>">
<meta property="og:image:type" content="image/png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="620">
<meta property="og:image" content="<https://github.githubassets.com/images/modules/open_graph/github-octocat.png>">
<meta property="og:image:type" content="image/png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="620">
<meta property="twitter:site" content="github">
<meta property="twitter:site:id" content="13334762">
<meta property="twitter:creator" content="github">
<meta property="twitter:creator:id" content="13334762">
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:title" content="GitHub">
<meta property="twitter:description" content="GitHub is where people build software. More than 36 million people use GitHub to discover, fork, and contribute to over 100 million projects.">
<meta property="twitter:image:src" content="<https://github.githubassets.com/images/modules/open_graph/github-logo.png>">
<meta property="twitter:image:width" content="1200">
<meta property="twitter:image:height" content="1200">
<meta name="pjax-timeout" content="1000">
<meta name="request-id" content="2ED9:0DCF:16C7FB:216F9D:5CC52252" data-pjax-transient="">
<meta name="selected-link" value="/" data-pjax-transient="">
<meta name="google-site-verification" content="KT5gs8h0wvaagLKAVWq8bbeNwnZZK1r1XQysX3xurLU">
<meta name="google-site-verificati
欢迎分享,转载请注明来源:夏雨云
评论列表(0条)