业界动态
HTML5 之 Meta 标签
2024-11-19 03:12

  meta 元素用于指定页面的信息和部分行为。通常用于指定网页的描述,关键字等。

HTML5 之 me<em></em>ta 标签

  可以被使用浏览器、搜索引擎或其他 Web 服务调用。

  规定文档的字符编码。

  是的新属性,替换了的指定字符编码的方式,可以减少部分代码量。

  指定页面关键字。

  指定页面描述信息。

  标注页面作者。

  标注页面版权信息。

  标注开发网页的工具或软件。

  告知搜索引擎抓取页面的方式。

  其中参数如下。

  • :搜索引擎可以索引此页面,默认属性,不设置标签,搜索引擎也会默认索引此页面
  • :搜索引擎不可索引此页面
  • :搜索引擎不可索引此页面的图片
  • :爬虫可以爬取此页面的链接
  • :爬虫不可爬取此页面的链接
  • :和的简写,搜索引擎可以索引此页面,爬虫可以爬取此页面的链接
  • :和的简写,搜索引擎不可索引此页面,爬虫不可爬取此页面的链接
  • :阻止搜索引擎在搜索结果中显示此页面的缓存版本,即网页快照
  • :功能同一致,适用于引擎
  • :搜索引擎的搜索结果中将显示一部分搜索文字上下文的内容,此属性即搜索引擎不可显示该内容,另外搜索引擎也不会保存该页面的快照
  • :搜索引擎的搜索结果中将显示一部分搜索文字上下文的内容,阻止使用信息做为此内容
  • :搜索引擎的搜索结果中将显示一部分搜索文字上下文的内容,阻止信息作为此内容

  指定浏览器以哪种浏览器内核渲染页面,其中参数包括(内核,极速模式)、(兼容模式,即、、的渲染模式)、(标准模式,即以及以上版本渲染)。

  移动端浏览器中,用于识别电话号码、电子邮箱和地理位置的格式。其中参数为(开启,默认值)、(关闭)。

  告知搜索引擎每隔多少天访问一次此页面。

  一般情况下,网站不需要此属性来限制搜索引擎的访问频率。只有网站数据量非常大时,被搜索引擎频繁抓取,会占用过多的服务器资源,影响网站的反应速度,这种情况一般设置每隔天来访问抓取一次网页即可。

  网站抓取时间取决于此属性和搜索引擎的重访时间,假设设置为天,若搜索引擎每隔天访问一次,不会生效,而最终搜索引擎按照天访问一次。搜索引擎每隔天访问一次,设置的天则会生效,最终搜索引擎每隔天访问一次页面。

  有来源页面的意思,即表示当前页面是由哪个页面跳转过来的,具体则是跳转至当前页面的请求的请求头中的字段包含了上一个页面的地址。

  可能会发现拼写少了一个,正确的拼写其实是,但是由于标准发布时没有发现拼写错误,所以就一直沿用至今。

  例如,当前页面的地址为。

  点击跳转至百度页面,查看页面请求的请求头。

HTML5 之 me<em></em>ta 标签

  因此服务端可以统计用户来源,并以此进行统计分析、日志记录以及缓存优化等。

  但是注意可能会暴露用户的浏览历史 ,并且很多时候当前页面的是会包含用户的个人信息的(例如,所以某些时候需要移除、禁用或者修改策略。

  属性值如下。

  • :不发送信息
  • :默认值,安全级别下降时不发送信息,目前仅一种情况安全级别下降,即网页跳转至网页,其它情况发送完整信息
  • :会发送信息,但是仅发送源信息,包括协议、域名和端口号
  • :仅同源链接发送完整信息
  • :即与合并,安全级别下降时不发送信息,安全级别未下降时发送 源信息
  • :跨域时发送源信息,非跨域时即同源情况发送完整信息
  • :同源链接发送完整信息,安全级别下降时不发送信息,其它情况发送源信息
  • :最不安全的策略,无论什么情况都发送 完整信息

  标签指定是修改全局策略。

  单个标签可通过属性修改局部策略,更多 详细参考。

HTML5 之 me<em></em>ta 标签

  规定文档的字符编码。

  标注页面的目标受众或者标注当前页面存在的语言。

  标注页面中脚本的类型。

  刷新或跳转(重定向)页面,表示刷新或跳转的时间与跳转的网址。

  后刷新页面。

  后页面跳转至百度,跳转方式为当前窗口下跳转。

  指定网页在缓存中的过期时间,一旦网页过期,必须到服务器上重新加载到本地缓存才能访问。

  指定网页在未来的某个时间过期,注意时间格式为(格林尼治标准时间)。

  指定网页可在本地缓存的时间(秒,指定或负数,则每次访问网页都需要从服务器重新加载内容。

  禁止浏览器从本地缓存中访问页面的内容,即用户无法脱机浏览。

  注意仅浏览器能识别此段标签含义,其它主流浏览器仅能识别属性的标签。为了网页兼容性,最好和两者一起使用。

  设置页面显示的窗口方式,参数如下,详细参考。

  • :页面以当前整个窗口的方式显示,可用于防止页面被其他网页嵌套
  • :页面以新打开的方式显示
  • :页面以当前容器或窗口显示
  • :页面以父容器或窗口显示

  设置值及其有效时间。

  注意浏览器正在远离此方式,可能由于浏览器版本原因,会产生警告或错误。此功能已在中废弃,并且在中完全删除。

  网页等级评定,浏览器可以根据网页的限制等级来过滤网页。

  设置网页退出和进入的过渡效果。

  其中包括淡入淡出过渡效果,此效果只能设置过渡持续时间(秒)。

  另一种,可以设置过渡效果类型和过渡持续时间(秒)。

  淡入持续秒。

  矩形扩大持续秒。

  其中过渡效果有种,包括(矩形缩小)、(矩形扩大)、(圆形缩小)、(圆形扩大)、(下到上刷新)、(上到下刷新)、(左到右刷新)、(右到左刷新)、(竖百叶窗)、(横百叶窗)、(错位横百叶窗)、(错位竖百叶窗)、(点扩散)、(左右到中间刷新)、(中间到左右刷新)、(中间到上下)、(上下到中间)、(右下到左上)、(右上到左下)、(左上到右下)、(左下到右上)、(横条)、(竖条)、(以上种随机选择一种)。

  注意由于浏览器的版本原因,多数都不再支持属性。

  针对的特殊属性,指定在浏览器内以哪种版本的模式来渲染页面内容,以此来解决浏览器的兼容问题。

  指定多个模式,如下在中浏览页面时,将会使用的标准模式渲染页面。由于自身不支持和,而是相对和的最高版本的渲染模式,故最终会以渲染页面。

  使用最新版本的浏览器渲染页面,即使用的是什么版本的浏览器,就用什么版本的标准渲染模式。

  指定浏览器使用)模式渲染页面,是谷歌内嵌浏览器框架,专门为浏览器开发的浏览器内核插件,支持、、等多个版本的浏览器。

   绝大多数网站均使用如下方式,即浏览器安装了插件,则使用浏览器内核渲染页面,若未安装插件,则使用最高版本的内核渲染页面。

   用于控制浏览器和服务器之间的缓存请求和响应。

   其中参数如下。

  • :可以在任何客户端(浏览器、本地缓存、各种代理服务器等)中缓存,但是不能设置缓存期限
  • :不仅可以被任何客户端缓存,而且还可以设置缓存期限。缓存期限是相对服务器时间而言的,超过设置时间,缓存则被认为过期,再次访问需要重新请求服务器加载缓存。如下最大缓存时间为秒,超过秒,缓存则被认为过期
  • :只能被单个用户缓存,不允许中间代理缓存。例如不能缓存的响应
  • :若缓存存在,只使用缓存,不需要请求服务器加载更新内容
  • :先发送请求,与服务器确认资源是否被修改,若未被修改,则使用缓存
  • :不允许缓存,再次访问需重新从服务器上加载缓存
  • :不可对网页内容或网页中的资源进行转换,以便节省缓存空间
  • :禁止百度、搜狗等搜索引擎对网页进行转码

  禁止百度、搜狗等网页进行转码处理。

  每次打开网页,清除网页缓存。协议需要用到来规范,而适用和来规范,为了网页兼容性,最好三个一起使用。

  禁用隐式的 DNS 预解析。

  用于优化移动端的网页,使得端的网页在手机端正常显示,页面布局不会错位。注意的属性只对移动端浏览器有效,对端浏览器是无效的。

  主要包括如下三种类型。

  • 布局视区:是指整个网页在移动端浏览器中显示的区域,此布局在大多数移动端浏览器中默认显示的宽度为(也有少部分或者其他宽度的,故只要整个网页宽度不超过此默认值,页面就可以正常显示
  • 可见视区:指的是移动端设备本身的屏幕显示区域,不同的移动设备,可见视区的尺寸也不同
  • 理想视区:指的是布局视区能完美适配移动设备的可见视区,即布局视区的宽度等于可见视区的宽度,因此不需要缩放和横向滚动条就能正常查看整个网页

  属性及其用法如下。

  • :控制布局视区的宽度,也可指定为固定宽度值,或者设置为。如果不设置或者为空,则使用默认宽度,即上述的或。如果设置为,则表示设置为理想视区,即布局视区宽度等于可见视区宽度。如果设置为固定宽度,单位为,也可以不带单位,默认单位为
  • :控制布局视区的高度,一般不设置,极少使用
  • :设置布局视区初始化缩放比例(即每一次加载页面时的缩放比例,为一个数字,可以是小数。如果设置为,则和一致,表示设置为理想视区。但是两者均有一个小缺陷,即会导致和横竖屏不分,会导致横竖屏不分,故两者都使用,可互相弥补缺陷
  • :允许用户缩放的最大比例值,为一个数字,可以带小数。需要大于
  • :允许用户缩放的最小比例值,为一个数字,可以带小数
  • :是否允许用户手动缩放布局视区,非必须参数,其中参数为(不允许)、(允许

x5-orientation

  指定屏幕方向,其中参数为(横屏)、(竖屏)。

x5-fullscreen

  全屏显示。

x5-page-mode

  指定页面以应用模式显示。

screen-orientation

  指定屏幕方向,其中参数为(横屏)、(竖屏)。

full-screen

  全屏显示。

browsermode

  指定页面以应用模式显示。

nightmode

  夜间模式,其中参数为(开启)、(关闭,注意若用户开启浏览器的夜间模式,而设置为,页面也是以非夜间模式显示。

imagemode

  强制图片显示,浏览器为用户提供了无图模式,但是某些页面图片是必须的(如验证码等,如下可强制页面显示图片。

  设置为会作用于整个页面,单张可设置如下。

layoutmode

  指定页面排版模式,其中参数为(简化页面处理,适用页面阅读省流)、(同标准浏览器一致,注意指定后,浏览器提供的页面排版模式将会失效。

viewport

  缩放不显示滚动条,其中参数为(用户缩放不会出现滚动条)、(同标准浏览器一致)。

apple-mobile-web-app-capable

  隐藏苹果默认的工具栏和菜单栏,其中参数包括(页面以全屏运行)、(正常显示)。

apple-mobile-web-app-status-bar-style

  设备顶部状态栏背景色,其中参数包括(白色,默认值)、(黑色)、(灰色半透明)。

apple-mobile-web-app-title

  网页添加到主屏幕后的标题(类似的名称)。

apple-touch-icon

  网页添加到主屏幕后的图标如下,其中支持属性,用来对应不同设备。

  (默认值)对应的老设备,对应,对应屏幕的和,对应的高分辨率。

  其中图标匹配方式如下。

  • 若没有与当前设备推荐尺寸一致的图标,则优先使用比推荐尺寸大,最接近推荐尺寸的图标
  • 若没有比推荐尺寸大的图标,则优先使用最接近推荐尺寸的图标
  • 若多个图标符合推荐尺寸,优先使用含关键字的图标
  • 若未用指定图标,自动搜索网站根目录下带有或者前缀的图标

  图标是标准图标大小的两倍,实际仅仅需要和两款图标即可。将图标的大小设置成标准图标的尺寸,会根据情况自动进行缩放。

apple-touch-startup-image

  网页添加到主屏幕后,设置打开后的启动画面。

  其中在和设备上只支持竖屏模式,图片分辨率为,在上支持竖屏和横屏两种模式,分辨率为和。

  不支持属性,可以使用来支持多种屏幕。

apple-touch-icon-precomposed

  区别于,若属性值为时,系统不会对图标添加类似于圆角和高光的效果,若属性值为时系统会自动为图标添加圆角和高光。

apple-itunes-app

  告知的浏览器,网页对应的,便于在页面显示的下载广告条。

google

  禁止自动翻译。

mobile-web-app-capable

  使用版本的浏览器添加到主屏幕后,页面以全屏显示,即隐藏工具栏和菜单栏。

theme-color

  指定版的浏览器的设备顶部状态栏主题色。

application-name

  指定页面代表的应用程序的名称,光标悬停在任务栏的固定网站按钮上时,此名称将出现在工具提示中,详细参考 application-name。

msapplication-tap-highlight

  禁止页面链接高亮。

msapplication-tooltip

  光标悬停在网页快捷方式上,将会显示此提示文本,详细参考 msapplication-tooltip。

msapplication-starturl

  指定网页快捷方式的根,不指定则默认使用当前页的地址,详细参考 msapplication-starturl。

msapplication-window

  指定网页快捷方式的首次启动的初始窗口大小,若用户调整了窗口大小,网页将保留新的尺寸值,详细参考 msapplication-window。

msapplication-navbutton-color

  自定义网页快捷方式的浏览器窗口中前进和后退按钮的颜色,详细参考 msapplication-navbutton-color。

msapplication-task

  将某个网页同引用程序一般固定在任务栏,在点击后显示一个相关站点的列表,详细参考 msapplication-task。

msapplication-task-separator

  在中呈现的站点列表中,在各个任务之间放置一条分割线。若指定多条分割线,则通过声明不同来使每条分割线都具有唯一性。

msapplication-TileImage

  版本后,支持将网页固定在开始屏幕中,且可以自定义图标和背景图,此属性用来指定图标,详细参考 msapplication-TileImage。

msapplication-TileColor

  同 类似,指定背景色,详细参考 msapplication-TileColor。

msApplication-ID

  用于网页关联应用程序,识别用户计算机是否安装了关联应用,若未安装,则提供指向安装此应用程序的直接链接,若安装了则显示切换到应用,详细参考 msApplication-ID。

msApplication-PackageFamilyName

  用于将网页连接到商店,详细参考 msApplication-PackageFamilyName。

msApplication-Arguments

  传递给应用程序的参数字符串,详细参考 msApplication-Arguments。

msApplication-MinVersion

  强制要求应用程序的最低版本,若用户尝试切换到过低版本的应用程序,会被链接到应用商店更新应用程序,详细参考 msApplication-Arguments。

msApplication-OptOut

  是否阻止用户安装或者切换应用程序,详细参考 msApplication-Arguments。

msapplication-badge

  将网页固定到开始屏幕后,可以轮询更新更新其中的应用程序,如下指定应用程序的更新方式,详细参考 msapplication-badge。

msapplication-config

  自定义网页快捷方式的更新方式、开始屏幕中图标等,注意需使用文件设置,详细参考 msapplication-config。

MSThemeCompatible

  是否在中开启的主题,其中表示打开的蓝色立体按钮系统显示样式。

MSSmartTagsPreventParsing

  中包含有开关,如下用户将看不到某些链接。

HandheldFriendly

  针对手持设备优化,主要是部分不识别的浏览器,例如黑莓。

MobileOptimized

  布局菜单桌面选择,浏览器根据此属性的值与屏幕宽度对比,决定使用何种布局方式,详细参考 MobileOptimized。

Open Graph Protocol

  是一种新的头部标记,此协议可以让网页成为富媒体对象,即网页内容可以被其它社会化网站引用,目前此协议被网站(等)采用。

  网页遵守此协议,可以有效从页面提取信息并呈现给用户,从而提高网站的传播效率。

  主要标签属性包括(标题)、(类型,常用值包括、、)、(缩略图地址)、(页面地址)、(页面描述)、(页面所在网站名)、(视频或地址)、(音频地址)。

App links

    以上就是本篇文章【HTML5 之 Meta 标签】的全部内容了,欢迎阅览 ! 文章地址:http://keair.bhha.com.cn/news/1153.html 
     文章      相关文章      动态      同类文章      热门文章      栏目首页      网站地图      返回首页 康宝晨移动站 http://keair.bhha.com.cn/mobile/ , 查看更多   
最新文章
十堰海尔热水器维修_十堰海尔热水器售后服务中心
十堰海尔热水器维修电话:0719-8025036,专业十堰海尔热水器维修、十堰海尔热水器售后服务,各区均有分点,方便快捷,多年十堰海尔热水器维修经验,诚信可靠,品质保证。
投稿干货!62个适合新手投稿的公众号,超易过稿!
↑点击上方蓝字“越万声”获取公众号一枚 本文共6000字,阅读时间10分钟晚上好~我是阿越~最近想着创建自由职业社群,结果发现
怎样优化网站排名靠前
在当今数字化时代,网站已成为企业展示产品和服务的重要窗口。仅仅拥有一个网站是不够的,如何让网站在搜索引擎中排名靠前,是每
国内十个免费自学网站
生活在这个充满竞争,血腥味十足分分钟钟就会别人取代的大数据移动互联时代,大家一有点时间就会拼命地给自己打鸡血充电学习,让
2024赚钱软件排行榜第一名 最靠谱的赚钱软件app平台推荐
想知道哪些网赚平台最可靠吗?小编将为你揭示网赚平台的整体优势和独特之处。这种新颖的赚钱模式,让你只需一台电脑或手机,就能
市场监管总局公布9起网络不正当竞争典型案例
随着互联网领域竞争业态及方式的转变,借助技术手段,衍生出的数据爬取、流量劫持等新型网络不正当竞争行为频发多发,刷单炒信、
免费外链群发工具
外链群发工具,什么是外链群发工具。相信大家都知道外链的作用。外链是为了促进更多的收入。而外链群发工具就是发布大量的外链。
恶心,北京一程序员研发“一键脱衣”AI软件,制作照片近七千张
辣眼睛,北京一研发“一键脱衣”AI软件,制作照片近七千张。近日,北京某公司员工白某某研发“”AI软件,通过AI软件将他人提供的
全网最详细中英文ChatGPT-GPT-4示例文档-人工智能助手从0到1快速入门——官网推荐的48种最佳应用场景(附python/node.js/curl命令源代码,小白也能学)
ChatGPT是目前最先进的AI聊天机器人,它能够理解图片和文字,生成流畅和有趣的回答。如果你想跟上AI时代的潮流ÿ
【省260元】iQOO安卓手机
iQOO Neo10 Pro 5G智能手机发布于24年11月29日,外观设计方面依旧悬浮之窗设计,机身薄至7.99mm,轻至199g。采用铟丝中框,1.4mm
相关文章