HTML 理解标签 - meta

meta标签 , 常用的有以下几个属性:

1. name : 比较常见的一些属性

　　author: 就是这个文档的作者名称，可以用自由的格式去定义

　　description: 包括一个关于页面内容的缩略而精准的描述

　　keywords: 网页关键词

　　referrer: 控制所有从该文档发出的 HTTP 请求中HTTP Referer 首部的内容, content可取的值请参考底部连接

　　viewport: 设备视口标签 , 可用于控制页面缩放及不同设备样式适配. contetn 可取的值有:

　　　　width: 一个正整数或者字符串 device-width => 指定页面的可视宽度, 像素值或 device-width

　　　　height: 一个正整数或者字符串 device-height => 指定页面的可视高度, 像素值或 device-height

　　　　initial-scale: 一个 0.0 到 10.0 之间的正数 => 设置页面初始化时的缩放比例

　　　　maximum-scale: 一个 0.0 到 10.0 之间的正数 => 设置页面最大缩放比例

　　　　minimum-scale: 一个 0.0 到 10.0 之间的正数 => 设置页面最小缩放比例

　　　　user-scalable: 一个布尔值(yes或者no) => 设置禁用缩放

2. httpEquiv : 这个枚举属性定义了能改变服务器和用户引擎行为的编译。这个编译值使用 content 来定义. -摘自MDN

3. content : 基于内容，这个属性为 http-equiv 或 name 属性提供了与其相关的值的定义. -摘自MDN

4. charset : 此特性声明当前文档所使用的字符编码，但该声明可以被任何一个元素的 lang 特性的值覆盖。-摘自MDN

贴上部分网站的代码:

京东首页:

  <meta charset="UTF-8">
  <title>京东(JD.COM)-正品低价、品质保障、配送及时、轻松购物！</title>
  <meta name="description" content="京东JD.COM-专业的综合网上购物商城,销售家电、数码通讯、电脑、家居百货、服装服饰、母婴、图书、食品等数万个品牌优质商品.便捷、诚信的服务，为您提供愉悦的网上购物体验!" />
  <meta name="Keywords" content="网上购物,网上商城,手机,笔记本,电脑,MP3,CD,VCD,DV,相机,数码,配件,手表,存储卡,京东" />
...其余省略...
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <meta name="renderer" content="webkit" />

淘宝首页:

<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="renderer" content="webkit" />
<title>淘宝网 - 淘！我喜欢</title>
<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 name="renderer" content="webkit"/>
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
...
<meta name="format-detection" content="telephone=no">
<meta name="format-detection" content="date=no">
<meta name="format-detection" content="address=no">
<meta name="keywords" content="商城,网上购物,网购,进口食品,美容护理,母婴玩具,家用电器,手机数码,家居生活,服饰内衣,营养保健,钟表珠宝,饰品箱包,汽车生活,图书音像,礼品卡"/>
<meta name="description" content="天猫，中国线上购物的地标网站，亚洲超大的综合性购物平台，拥有10万多品牌商家。每日发布大量国内外商品！正品网购，上天猫！天猫千万大牌正品,品类全，一站购，支付安全，退换无忧！理想生活上天猫!"/>

<meta property="og:title" content="天猫">
<meta property="og:type" content="website">
<meta property="og:url" content=" https://www.tmall.com/">
<meta property="og:image" content=" https://img.alicdn.com/tfs/TB1MaLKRXXXXXaWXFXXXXXXXXXX-480-260.png">

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />

更多内容参考: https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/meta