首页  >  文章  >  web前端  >  什么是head标签 ?html中head标签的介绍

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

不言
不言原创
2018-08-13 17:50:004211浏览

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

什么是head标签

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

<head>
  <meta charset="utf-8">
  <title>My test page</title>
</head>
  • 元数据就是描述数据的数据.

title

元素 是用来表示整个HTML文档大致内容的元数据(不是文档的内容.)<br>元素 <title> 也被以其他的方式使用着. 比如说,如果你尝试为某个页面添加书签,(Bookmarks > Bookmark This Page, 在火狐浏览器中), 你会看到 <title> 的内容被作为建议的书签名.</p> <h2>元数据<meta></h2> <p>元数据就是描述数据的数据,而HTML有一个“官方的”方式来为一个文档添加元数据,——  <meta> 元素. 当然,其他在这篇文章中提到的东西也可以被当作元数据。 有很多不同种类的 <meta> 元素可以被包含进你的页面的<head>元素, 但是现在我们还不会尝试去解释所有类型, 这只会引起混乱。</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></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> 部分没必要非要放在文档头部; 实际上,把它放在文档的尾部(在 </body>标签之前)是一个更好的选择<br>  ,这样可以确保在加载脚本之前浏览器已经解析了HTML内容(如果脚本加载某个不存在的元素,浏览器会报错)。</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><p>以上是什么是head标签 ?html中head标签的介绍的详细内容。更多信息请关注PHP中文网其他相关文章!</p></div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>声明:</span><div>本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn</div></div></div><div class="nphpSytBox"><span>上一篇:<a class="dBlack" title="html提交按钮标签代码是什么,怎么使用?(示例)" href="https://m.php.cn/zh/faq/408203.html">html提交按钮标签代码是什么,怎么使用?(示例)</a></span><span>下一篇:<a class="dBlack" title="html5用什么开发工具" href="https://m.php.cn/zh/faq/408215.html">html5用什么开发工具</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>相关文章</h2><em><a href="https://m.php.cn/zh/article.html" class="bBlack"><i>查看更多</i><b></b></a></em><div class="clear"></div></div><ul class="nphpXgwzList"><li><b></b><a href="https://m.php.cn/zh/faq/348757.html" title="Html小知识总结" class="aBlack">Html小知识总结</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/zh/faq/348804.html" title="如何快速学习HTML" class="aBlack">如何快速学习HTML</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/zh/faq/348873.html" title="html xhtml xml的区别" class="aBlack">html xhtml xml的区别</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/zh/faq/348884.html" title="src与href属性的区别" class="aBlack">src与href属性的区别</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/zh/faq/348902.html" title="关于HTML5和CSS替换使用" class="aBlack">关于HTML5和CSS替换使用</a><div class="clear"></div></li></ul></div></div><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>公益在线PHP培训,帮助PHP学习者快速成长!</p></div><div class="footermid"><a href="https://m.php.cn/zh/about/us.html">关于我们</a><a href="https://m.php.cn/zh/about/disclaimer.html">免责声明</a><a href="https://m.php.cn/zh/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved </p></div></div></footer><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了,就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body></html>