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