HTML中head标签内容介绍

Posted 2022-03-30 ffyd-0511

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了HTML中head标签内容介绍相关的知识，希望对你有一定的参考价值。

在利用VScode编写代码时，我们利用VScode的!键自动生成头部代码时，会自动生成以下内容

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>html</title>
</head>

　　对于<head>中的内容又有什么意义，<head> 标签用于定义文档的头部，头部描述了文档的各种属性和信息，包括文档的标题、在 Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。在<head>标签中，我们可以使用如下标签，<meta>元信息标签，<title>用于定义网页标题，<rel>用于定义网页的引用内容，如样式表，图标等，<script>定义网页引用的脚本或者我们可以直接在其中编写脚本，但最好不要头部中编写脚本，因为这会导致浏览器加载效率，最好将脚本放置在页面尾部。<style>标签用于定义网页的样式表。

　　接下来我们讲述<meta>标签的作用。<meta>标签主要用来描述网页的相关信息。

　　<meta>标签主要有有三个属性，charset，name，http-equiv。

　　charset用来定义此网页是采用什么编码方式，我们常用UTF-8的编码方式

　　name则主要用来描述网页的内容信息，如author，keywords，description等。name采用名值对方式，name中的为属性名，content中的则是具体的值。例如

<meta name="keywords" content="计算机，前端，head标签">

利用name，我们可以定义我们自己想用来描述这个页面的有关信息。　　

　　http-equiv则主要用来向浏览器传输一些有关网页的信息，用来精确的显示网页信息

　　它采用和name一样采用名值对方式，可用来重刷新页面并重指向页面以及制定是否使用cookie等。例如，页面添加以下语句，将在三秒后刷新，并重定位到百度页面

 <meta http-equiv="refresh" content="3; url=http://www.baidu.com">

　　VScode的自动生成代码中的X-UA-Compatible则是微软IE8的专有属性，它告诉IE8采用何种浏览器的方式去渲染页面。

<title>标签则用于定义网页的标题

例：添加外部样式表

<link rel="stylesheet" href="CSS\index.css">

例：添加网页自定义图标

 <link rel="shortcut icon" href="images\favicon.ico" type="image/x-icon">

　以上就是head标签中部分常用标签的介绍，具体meta标签和link标签的具体值使用情况，可参考以下两位大神文章。

meta标签：http://www.divcss5.com/html/h50455.shtml

link标签：https://blog.csdn.net/lengye7/article/details/86763608

以上是关于HTML中head标签内容介绍的主要内容，如果未能解决你的问题，请参考以下文章