搜索
首页web前端html教程html中的meta标签是什么?meta标签的属性介绍

本章给大家介绍html中的meta标签是什么?meta标签的属性介绍。有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

什么是meta标签? 

      meta标签是html标记head区的一个关键标签,它位于HTML文档的

之间(有些也不是在和<title>之间)。它提供的信息虽然用户不可见,但却是文档的最基本的元信息。meta标签用来描述一个HTML网页文档的属性,例如作者、日期和时间、网页描述、关键词、页面刷新等。<p>注:元信息是关于信息的信息,元信息允许服务器提供所发送数据的信息,如http可以提高所发的对象语言和对象,也可以用元信息来实现有条件请求以及报告事务完成。收到数据的浏览器可以根据元信息确定服务器发来的是什么内容,预料有什么数据,确知是否接收完整的数据,以及过程中是否出错,这样客户就可以知道传输对象的类型。</p> <p><span style="font-size: 18px;"><strong>meta标签的属性有哪些? </strong></span></p> <p> <img src="/static/imghwm/default1.png" data-src="https://img.php.cn//upload/image/402/350/428/1536659975962189.jpg?x-oss-process=image/resize,p_40" class="lazy" title="1536659975962189.jpg" alt="html中的meta标签是什么?meta标签的属性介绍"></p> <p><strong>属性详解:</strong></p> <p>1.http-equiv</p> <p>相当于http的文件头作用,它可以向浏览器传回一些有用的信息,以帮助浏览器正确地显示网页内容。</p> <p>语法:<meta http-equiv="参数" content="参数值"></p> <p>参数:</p> <p>1) content-Type(设定页面使用的字符集)</p><pre class='brush:php;toolbar:false;'><metahttp-equiv="content-Type" content="text/html;charset=gb2312"></pre><p>http-equiv=Content-Type代表的是HTTP的头部协议,提示浏览器网页的信息,</p> <p>meta标签的charset的信息参数如GB2312时,代表说明网站是采用的编码是简体中文;</p> <p>meta标签的charset的信息参数如BIG5时,代表说明网站是采用的编码是繁体中文;</p> <p>meta标签的charset的信息参数如iso-2022-jp时,代表说明网站是采用的编码是日文;</p> <p>meta标签的charset的信息参数如ks_c_5601时,代表说明网站是采用的编码是韩文;</p> <p>meta标签的charset的信息参数如ISO-8859-1时,代表说明网站是采用的编码是英文;</p> <p>meta标签的charset的信息参数如UTF-8时,代表世界通用的语言编码;</p> <p>2) content-Language(显示语言的设定)     </p><pre class='brush:php;toolbar:false;'><meta http-equiv="Content-Language" content="zh-cn"/></pre><p>3) Expires(期限,可以用于设定网页的到期时间。一旦网页过期,必须到服务器上重新传输)</p><pre class='brush:php;toolbar:false;'><meta http-equiv="expires" content="Fri,12Jan200118:18:18GMT"></pre><p>注意:必须使用GMT的时间格式。</p> <p>4) Pragma(cache模式,禁止浏览器从本地计算机的缓存中访问页面内容)</p><pre class='brush:php;toolbar:false;'><meta http-equiv="Pragma" content="no-cache"></pre><p>注意:这样设定,访问者将无法脱机浏览。</p> <p>5) cache-control(缓存设置)</p><pre class='brush:php;toolbar:false;'><meta http-equiv="cache-control" content="no-cache"></pre><p>请求时的缓存指令包括no-cache、no-store、max-age、max-stale、min-fresh、only-if-cached,响应消息中的指令包括public、private、no-cache、no-store、no-transform、must-revalidate、proxy-revalidate、max-age。各个消息中的指令含义如下:</p> <p>Public指示响应可被任何缓存区缓存</p> <p>Private指示对于单个用户的整个或部分响应消息,不能被共享缓存处理。这允许服务器仅仅描述当用户的部分响应消息,此响应消息对于其他用户的请求无效</p> <p>no-cache指示请求或响应消息不能缓存</p> <p>no-store用于防止重要的信息被无意的发布。在请求消息中发送将使得请求和响应消息都不使用缓存。</p> <p>max-age指示客户机可以接收生存期不大于指定时间(以秒为单位)的响应</p> <p>min-fresh指示客户机可以接收响应时间小于当前时间加上指定时间的响应</p> <p>max-stale指示客户机可以接收超出超时期间的响应消息。如果指定max-stale消息的值,那么客户机可以接收超出超时期指定值之内的响应消息。</p> <p>6) Refresh(自动刷新并指向新页面)</p><pre class='brush:php;toolbar:false;'><meta http-equiv="Refresh" content="2; URL=http://www.baidu.com"> //(注意后面的引号,分别在秒数的前面和网址的后面)</pre><p>注意:其中的2是指停留2秒钟后自动刷新到URL网址。</p> <p>7) Window-target(强制页面在当前窗口以独立页面显示)<br></p><pre class='brush:php;toolbar:false;'><meta http-equiv="Window-target" content="_top"></pre><p>注意:用来防止别人在框架里调用自己的页面。</p> <p>8) set-cookie(cookie设定,如果网页过期,那么存盘的cookie将被删除)</p><pre class='brush:php;toolbar:false;'><meta http-equiv="Set-Cookie" content="cookie value=xxx; expires=Friday,12-Jan-200118:18:18GMT;path=/"></pre><p> 通常强制要求浏览器不设置缓存重新从服务器获取页面会使用下面的方式:</p><pre class='brush:php;toolbar:false;'><meta http-equiv=”pragma” content=”no-cache”> <meta http-equiv=”cache-control” content=”no-cache”> <meta http-equiv=”expires” content=”0″></pre><p><strong>2.name属性</strong></p> <p>    name属性主要用于描述网页,与之对应的属性值为content,content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。</p> <p>    语法:</p><pre class='brush:php;toolbar:false;'><meta name="参数" content="具体的参数值"></pre><p>Keywords(关键字)</p> <p>说明:keywords用来告诉搜索引擎你网页的关键字是什么。</p><pre class='brush:php;toolbar:false;'><meta name="keywords" content=""></pre><p>description(网站内容描述)</p> <p>说明:description用来告诉搜索引擎你的网站主要内容。</p><pre class='brush:php;toolbar:false;'><metaname="description" content=""></pre><p>robots(机器人向导)</p> <p>说明:Meta robots标签管理着搜索引擎是否可以进入网页,你可以用它来允许或不允许搜索引擎来获取你的网页、进入你网页中的子链接或对你的网页存档。content的参数有all,none,index,noindex,follow,nofollow。默认是all。</p><pre class='brush:php;toolbar:false;'><metaname="robots" content="none"></pre><p>具体参数如下:</p> <p>信息参数为all:文件将被检索,且页面上的链接可以被查询;</p> <p>信息参数为none:文件将不被检索,且页面上的链接不可以被查询;</p> <p>信息参数为index:文件将被检索;</p> <p>信息参数为follow:页面上的链接可以被查询;</p> <p>信息参数为noindex:文件将不被检索,但页面上的链接可以被查询;</p> <p>信息参数为nofollow:文件将被检索,但页面上的链接不可以被查询;</p> <p>author(作者)</p> <p>说明:标注网页的作者</p><pre class='brush:php;toolbar:false;'><metaname="author" content="jesse131work@163.com"></pre><p>generator</p> <p>说明:meta标签的generator的信息参数,代表说明网站的采用的什么软件制作。</p><pre class='brush:php;toolbar:false;'><metaname="generator" content="信息参数"/></pre><p>copyright</p> <p>  说明:meta标签的copyright的信息参数,代表说明网站版权信息。</p><pre class='brush:php;toolbar:false;'><metaname="copyright" content="信息参数"></pre><p>revisit-after</p> <p>  说明:revisit-after代表网站重访,7days代表7天,依此类推,假如我设置,那这样搜索引擎就是7天来一次。使用这个标签的网站,通常是因为网站数据量非常大,被搜索引擎过         于频繁的抓取,会占用过大的资源,影响网站的访问。所以,希望搜索引擎不要天天过来,抓取过一次了,那么等7天后再来。一般的网站是不需要这个标签的。</p> <p><meta name="revisit-after" content="7days"></p> <p>view-point</p> <p>  说明:主要影响移动页面布局</p><pre class='brush:php;toolbar:false;'><meta name="viewport" content="width=device-width, initial-scale=1.0"></pre><p>content 参数:</p> <p>width viewport 宽度(数值/device-width)</p> <p>height viewport 高度(数值/device-height)</p> <p>initial-scale 初始缩放比例</p> <p>maximum-scale 最大缩放比例</p> <p>minimum-scale 最小缩放比例</p> <p>user-scalable 是否允许用户缩放(yes/no)</p> <p><strong>3.content属性</strong></p> <p> content属性一般与name和http-equiv属性一起用,视它们的值而定。</p> <p><strong>4.charset属性</strong></p> <p>charset属性,是html5的属性,可替换<metahttp-equiv content="text/html;charset=gb2312">设置为<meta charset="utf-8"></metahttp-equiv></p> <p>设置meta属性的作用是什么?</p> <p> meta标签提供关于HTML文档的元数据。元数据不会显示在页面上,但是对于机器是可读的。它可用于浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他 web 服务。meta标签可用于缓存设置,还与SEO优化相关。SEO是指通过采用易于搜索引擎索引的合理手段,使网站各项基本要素适合搜索引擎检索原则并且对用户更友好(Search Engine Friendly),从而更容易被搜索引擎收录及优先排序从属于SEM(搜索引擎营销)。通俗理解是:通过总结搜索引擎的排名规律,对网站进行合理优化,使你的网站在百度和goog的排名提高,让搜索引擎给你带来客户。</p> <p> seo优化常用语句如下</p><pre class='brush:php;toolbar:false;'><!-- 页面标题<title>标签(head 头部必须) --> <title>your title</title> <!-- 页面关键词 keywords --> <meta name="keywords" content="your keywords"> <!-- 页面描述内容 description --> <meta name="description" content="your description"> <!-- 定义网页作者 author --> <meta name="author" content="author,email address"> <!-- 定义网页搜索引擎索引方式,robotterms 是一组使用英文逗号「,」分割的值,通常有如下几种取值:none,noindex,nofollow,all,index和follow。 --> <meta name="robots" content="index,follow"></pre>

以上是html中的meta标签是什么?meta标签的属性介绍的详细内容。更多信息请关注PHP中文网其他相关文章!

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
从文本到网站:HTML的力量从文本到网站:HTML的力量Apr 13, 2025 am 12:07 AM

HTML是一种用于构建网页的语言,通过标签和属性定义网页结构和内容。1)HTML通过标签组织文档结构,如、。2)浏览器解析HTML构建DOM并渲染网页。3)HTML5的新特性如、、增强了多媒体功能。4)常见错误包括标签未闭合和属性值未加引号。5)优化建议包括使用语义化标签和减少文件大小。

了解HTML,CSS和JavaScript:初学者指南了解HTML,CSS和JavaScript:初学者指南Apr 12, 2025 am 12:02 AM

WebDevelovermentReliesonHtml,CSS和JavaScript:1)HTMLStructuresContent,2)CSSStyleSIT和3)JavaScriptAddSstractivity,形成thebasisofmodernWebemodernWebExexperiences。

HTML的角色:构建Web内容HTML的角色:构建Web内容Apr 11, 2025 am 12:12 AM

HTML的作用是通过标签和属性定义网页的结构和内容。1.HTML通过到、等标签组织内容,使其易于阅读和理解。2.使用语义化标签如、等增强可访问性和SEO。3.优化HTML代码可以提高网页加载速度和用户体验。

HTML和代码:仔细观察术语HTML和代码:仔细观察术语Apr 10, 2025 am 09:28 AM

htmlisaspecifictypefodyfocusedonstructuringwebcontent,而“代码” badlyLyCludEslanguagesLikeLikejavascriptandPytyPythonForFunctionality.1)htmldefineswebpagertuctureduseTags.2)“代码”代码“ code” code code code codeSpassSesseseseseseseseAwiderRangeLangeLangeforLageforLogageforLogicIctInterract

HTML,CSS和JavaScript:Web开发人员的基本工具HTML,CSS和JavaScript:Web开发人员的基本工具Apr 09, 2025 am 12:12 AM

HTML、CSS和JavaScript是Web开发的三大支柱。1.HTML定义网页结构,使用标签如、等。2.CSS控制网页样式,使用选择器和属性如color、font-size等。3.JavaScript实现动态效果和交互,通过事件监听和DOM操作。

HTML,CSS和JavaScript的角色:核心职责HTML,CSS和JavaScript的角色:核心职责Apr 08, 2025 pm 07:05 PM

HTML定义网页结构,CSS负责样式和布局,JavaScript赋予动态交互。三者在网页开发中各司其职,共同构建丰富多彩的网站。

HTML容易为初学者学习吗?HTML容易为初学者学习吗?Apr 07, 2025 am 12:11 AM

HTML适合初学者学习,因为它简单易学且能快速看到成果。1)HTML的学习曲线平缓,易于上手。2)只需掌握基本标签即可开始创建网页。3)灵活性高,可与CSS和JavaScript结合使用。4)丰富的学习资源和现代工具支持学习过程。

HTML中起始标签的示例是什么?HTML中起始标签的示例是什么?Apr 06, 2025 am 12:04 AM

AnexampleOfAstartingTaginHtmlis,beginSaparagraph.startingTagSareEssentialInhtmlastheyInitiateEllements,defiteTheeTheErtypes,andarecrucialforsstructuringwebpages wepages webpages andConstructingthedom。

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
3 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
3 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
3 周前By尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解锁Myrise中的所有内容
4 周前By尊渡假赌尊渡假赌尊渡假赌

热工具

MinGW - 适用于 Windows 的极简 GNU

MinGW - 适用于 Windows 的极简 GNU

这个项目正在迁移到osdn.net/projects/mingw的过程中,你可以继续在那里关注我们。MinGW:GNU编译器集合(GCC)的本地Windows移植版本,可自由分发的导入库和用于构建本地Windows应用程序的头文件;包括对MSVC运行时的扩展,以支持C99功能。MinGW的所有软件都可以在64位Windows平台上运行。

螳螂BT

螳螂BT

Mantis是一个易于部署的基于Web的缺陷跟踪工具,用于帮助产品缺陷跟踪。它需要PHP、MySQL和一个Web服务器。请查看我们的演示和托管服务。

安全考试浏览器

安全考试浏览器

Safe Exam Browser是一个安全的浏览器环境,用于安全地进行在线考试。该软件将任何计算机变成一个安全的工作站。它控制对任何实用工具的访问,并防止学生使用未经授权的资源。

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

Dreamweaver Mac版

Dreamweaver Mac版

视觉化网页开发工具