什么是head标签？html中head标签的介绍

不言

发布时间：2018-08-13 17:50:00

4628人浏览过

来源于php中文网

原创

本篇文章给大家带来的内容是关于什么是head标签？html中head标签的介绍，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

什么是head标签

head 标签是

元素的内容。不像元素的内容可以显示在浏览器中，head 的内容不会在浏览器中显示，它的作用是包含一些页面的元数据。在下面的例子中，head 的内容很少。


  
  My test page

元数据就是描述数据的数据.

title

元素

是用来表示整个HTML文档大致内容的元数据(不是文档的内容.)<br>元素 <title> 也被以其他的方式使用着. 比如说，如果你尝试为某个页面添加书签，(Bookmarks > Bookmark This Page, 在火狐浏览器中), 你会看到 <title> 的内容被作为建议的书签名.<h2>元数据<meta> </h2> <p>元数据就是描述数据的数据，而HTML有一个“官方的”方式来为一个文档添加元数据，—— <meta> 元素. 当然，其他在这篇文章中提到的东西也可以被当作元数据。有很多不同种类的 <meta> 元素可以被包含进你的页面的</p>元素, 但是现在我们还不会尝试去解释所有类型, 这只会引起混乱。<p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p><pre class="brush:php;toolbar:false;"><meta charset="utf-8"></pre><ul class=" list-paddingleft-2"><li><p>这个元素简单的指定了文档的字符编码 —— 在这个文档中被允许使用的字符集。 utf-8<br> 是一个通用的字符集，它包含了任何人类语言中的大部分的字符。这意味着你的web页面可以显示任意的语言; 许多<meta><br> 元素包含了name 和 content 特性.</p><div class="aritcle_card flexRow"> <div class="artcardd flexRow"> <a class="aritcle_card_img" href="/xiazai/code/9803" title="微尔企业网站管理系统1.75 build build 090709"><img src="https://img.php.cn/upload/webcode/000/000/019/175998960818035.jpg" alt="微尔企业网站管理系统1.75 build build 090709"></a> <div class="aritcle_card_info flexColumn"> <a href="/xiazai/code/9803" title="微尔企业网站管理系统1.75 build build 090709">微尔企业网站管理系统1.75 build build 090709</a> <p>系统功能介绍 1 包含企业网站所必备的功能：企业信息、产品管理、人才招聘、新闻资讯、企业图片、以及视频下载等模块2 由于是从CMS系统的基础上开发而成，因此相对于一些其他的企业网站管理系统，本系统具备更强的可扩展能力，可以胜任从小型工作室到大中型企业网上门户等各种不同规模网站的需求。3 后台管理与模板完全分离，并具备非常灵活的标签技术，可以实现无限制个性化的界面定制4 操作简单，利用已经制作好的模</p> </div> <a href="/xiazai/code/9803" title="微尔企业网站管理系统1.75 build build 090709" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div></li></ul> <p>name 特性指定了meta 元素的类型; 说明该元素包含了什么类型的信息。<br>content 指定了实际的元数据内容。<br>这两个meta 元素对于定义你的页面的作者和提供页面的内容描述是很有用的。</p><pre class="brush:php;toolbar:false;"><meta name="author" content="Chris Mills"> <meta name="description" content="The MDN Learning Area aims to provide complete beginners to the Web with all they need to know to get started with developing web sites and applications."></pre><ul class=" list-paddingleft-2"><li><p>指定作者在某些情况下是很有用的：如果你需要联系页面的作者，问一些关于页面内容的问题。<br> 一些内容管理系统能够自动获取页面作者的信息，然后用于某种目的。<br> 指定包含关于页面内容的关键字的页面内容的描述是很有用的，因为它可能或让你的页面在搜索引擎的相关的搜索出现得更多 (这些行为术语上被称为<br> Search Engine Optimization, or SEO.)</p></li></ul> <h2>在你的站点增加自定义图标</h2><pre class="brush:php;toolbar:false;"><link rel="shortcut icon" href="favicon.ico" type="image/x-icon"></pre><h2>在HTML中应用CSS和JavaScript</h2><pre class="brush:php;toolbar:false;"><link rel="stylesheet" href="my-css-file.css"></pre><ul class=" list-paddingleft-2"><li><p><link> 元素经常位于文档的头部，它有2个属性， rel="stylesheet"，表明这是文档的样式表，而<br> href,包含了样式表文件的路径。</p></li></ul><pre class="brush:php;toolbar:false;"><script src="my-js-file.js"></script></pre><ul class=" list-paddingleft-2"><li><p><script> 部分没必要非要放在文档头部; 实际上，把它放在文档的尾部（在标签之前）是一个更好的选择<br/> ，这样可以确保在加载脚本之前浏览器已经解析了HTML内容（如果脚本加载某个不存在的元素，浏览器会报错）。</script></p></li></ul> <h2>为文档设定主语言</h2><pre class="brush:php;toolbar:false;"><html lang="en-US"></pre><ul class=" list-paddingleft-2"><li><p>这在很多方面都很有用。如果你的HTML文档的语言设置好了，那么你的HTML文档就会被搜索引擎更有效地索引<br> (例如，允许它在特定于语言的结果中正确显示),对于那些使用屏幕阅读器的视障人士也很有用(比如,<br> 法语和英语中都有“six”这个单词，但是发音却完全不同)。</p></li></ul> <p class="post-topheader custom- pt0">相关推荐：</p> <p class="post-topheader custom- pt0"><a href="http://www.php.cn/html5-tutorial-407893.html" target="_blank" title="Html5中video标签的用法：如何自动填充满父div标签">Html5中video标签的用法：如何自动填充满父div标签</a></p> <p class="post-topheader custom- pt0"><a href="http://www.php.cn/div-tutorial-408203.html" target="_blank" title="html提交按钮标签代码是什么，怎么使用？（示例）">html提交按钮标签代码是什么，怎么使用？（示例）</a></p> <p class="post-topheader custom- pt0"><a href="http://www.php.cn/div-tutorial-408104.html" target="_blank" title="html页面中友情链接怎么进行添加设置？（代码示例）">html页面中友情链接怎么进行添加设置？（代码示例）</a></p>

为何要将HTML升级为HTML5_了解升级必要性明确方向【意义】

HTML和HTML5兼容性差别在哪_不同浏览器支持度揭秘【对比】

HTML与HTML5对SEO影响有别吗_搜索引擎识别法【建议】

HTML字符实体怎样HTML5化简化_用标准实体减少特殊符号【实体】

HTML怎样检测是否兼容HTML5_用简单方法判断兼容性【检测】

HTML速学教程(入门课程)

HTML怎么学习？HTML怎么入门？HTML在哪学？HTML怎么学才快？不用担心，这里为大家提供了HTML速学教程(入门课程)，有需要的小伙伴保存下载就能学习啦！

下载

相关专题

Golang gRPC 服务开发与Protobuf实战

本专题系统讲解 Golang 在 gRPC 服务开发中的完整实践，涵盖 Protobuf 定义与代码生成、gRPC 服务端与客户端实现、流式 RPC（Unary/Server/Client/Bidirectional）、错误处理、拦截器、中间件以及与 HTTP/REST 的对接方案。通过实际案例，帮助学习者掌握使用 Go 构建高性能、强类型、可扩展的 RPC 服务体系，适用于微服务与内部系统通信场景。

2026.01.15

公务员递补名单公布时间公务员递补要求

公务员递补名单公布时间不固定，通常在面试前，由招录单位（如国家知识产权局、海关等）发布，依据是原入围考生放弃资格，会按笔试成绩从高到低递补，递补考生需按公告要求限时确认并提交材料，及时参加面试/体检等后续环节。要求核心是按招录单位公告及时响应、提交材料（确认书、资格复审材料）并准时参加面试。

2026.01.15

公务员调剂条件 2026调剂公告时间

(一)符合拟调剂职位所要求的资格条件。 (二)公共科目笔试成绩同时达到拟调剂职位和原报考职位的合格分数线，且考试类别相同。拟调剂职位设置了专业科目笔试条件的，专业科目笔试成绩还须同时达到合格分数线，且考试类别相同。 (三)未进入原报考职位面试人员名单。

2026.01.15

国考成绩查询入口国考分数公布时间2026

笔试成绩查询入口已开通，考生可登录国家公务员局中央机关及其直属机构2026年度考试录用公务员专题网站http://bm.scs.gov.cn/pp/gkweb/core/web/ui/business/examResult/written_result.html，查询笔试成绩和合格分数线，点击“笔试成绩查询”按钮，凭借身份证及准考证进行查询。

2026.01.15