meta常用标签总结
meta元素共有三个可选属性(http-equiv、name和scheme)和一个必选属性(content),content定义与 http-equiv 或 name 属性相关的元信息
可选属性
属性 | 值 | 描述 |
---|---|---|
http-equiv | content-type / expire / refresh / set-cookie | 把content属性关联到HTTP头部 |
name | author / description / keywords / generator / revised / others | 把 content 属性关联到一个名称 |
scheme | some_text | 定义用于翻译 content 属性值的格式 |
必选属性
属性 | 值 | 描述 |
---|---|---|
content | some_text | 定义与 http-equiv 或 name 属性相关的元信息 |
name属性
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | <!-- 页面作者 --> <meta name= "author" content= "author name" /> <!-- 页面描述 --> <meta name= "description" content= "meta元素共有三个可选属性(不超过150字符)" /> <!-- 页面关键词 --> <meta name= "keywords" content= "meta标签总结,meta标签" /> <!-- 页面生成器 --> <meta name= "generator" content= "hexo" /> <!-- 页面修改信息 --> <meta name= "revised" content= "story,2015/07/22" /> <!-- 版权信息 --> <meta name= "copyright" content= "All Rights Reserved" /> <!-- 页面爬虫设置 --> <meta name= "robots" content= "index,follow" /> <!-- robots的content取值 --> <!-- all:文件将被检索,且页面上的链接可以被查询 -- <!-- none:文件将不被检索,且页面上的链接不可以被查询 --> <!-- index:文件将被检索 --> <!-- follow:页面上的链接可以被查询 --> <!-- noindex:文件将不被检索,但页面上的链接可以被查询 --> <!-- nofollow:文件将被检索,但页面上的链接不可以被查询 --> |
http-equiv
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <!-- 字符编码 --> <meta http-equiv= "content-type" content= "text/html;charset=UTF-8" /> <!-- 页面到期时间 --> <meta http-equiv= "expire" content= "Wed,22Jul201511:11:11GMT" /> <!-- 页面重刷新,0秒后刷新并跳转 --> <meta http-equiv= "refresh" content= "0;URL=''" /> <!-- cookie设置 --> <meta http-equiv= "set-cookie" content= "cookie value=xxx;expires=Wed,22-Jul-201511:11:11GMT;path=/" /> <!-- 脚本类型 --> <meta http-equiv= "Content-Script-Type" Content= "text/javascript" > <!-- 禁止从本地缓存中读取页面 --> <meta http-equiv= "Pragma" content= "no-cache" > |
移动端
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 | <meta name= "viewport" content= "width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no" /> <!-- viewport的content取值 --> <!-- width:宽度(数值 / device-width)(200~10000,默认为980px) --> <!-- height:高度(数值 / device-height)(223~10000) --> <!-- initial-scale:初始缩放比例 (0~10) --> <!-- minimum-scale:允许用户缩放到的最小比例 --> <!-- maximum-scale:允许用户缩放到的最大比例 --> <!-- user-scalable:是否允许用户缩放 (no/yes) --> <!-- QQ浏览器私有 --> <!-- 全屏模式 --> <meta name= "x5-fullscreen" content= "true" > <!-- 强制竖屏 --> <meta name= "x5-orientation" content= "portrait" > <!-- 强制横屏 --> <meta name= "x5-orientation" content= "landscape" > <!-- 应用模式 --> <meta name= "x5-page-mode" content= "app" > <!-- UC浏览器私有 --> <!-- 全屏模式 --> <meta name= "full-screen" content= "yes" > <!-- 强制竖屏 --> <meta name= "screen-orientation" content= "portrait" > <!-- 强制横屏 --> <meta name= "screen-orientation" content= "landscape" > <!-- 应用模式 --> <meta name= "browsermode" content= "application" > <!-- IOS启用 WebApp 全屏模式 --> <meta name= "apple-mobile-web-app-capable" content= "yes" /> <!-- IOS全屏模式下隐藏状态栏/设置状态栏颜色 content的值为 default | black | black-translucent --> <meta name= "apple-mobile-web-app-status-bar-style" content= "black-translucent" /> <!-- IOS添加到主屏后的标题 --> <meta name= "apple-mobile-web-app-title" content= "标题" > <!-- IOS添加智能 App 广告条 Smart App Banner --> <meta name= "apple-itunes-app" content= "app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL" > <!-- 去除iphone 识别数字为号码 --> <meta name= "format-detection" content= "telephone=no" > <!-- 不识别邮箱 --> <meta name= "format-detection" content= "email=no" > <!-- 禁止跳转至地图 --> <meta name= "format-detection" content= "adress=no" > <!-- 可以连写--> <meta name= "format-detection" content= "telephone=no,email=no,adress=no" > <!-- 设置缓存,看实际需求设置 --> <meta http-equiv= "Cache-Control" content= "no-cache" /> <!-- 优先使用最新版本 IE 和 Chrome--> <meta http-equiv= "X-UA-Compatible" content= "IE=edge,chrome=1" /> |
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 三行代码完成国际化适配,妙~啊~
· .NET Core 中如何实现缓存的预热?