HTML 头部

<head> 元素是所有头部元素的容器。可包含脚本、样式表，元信息等等。下面将介绍常用的几个标签。

标签	描述
<title>	标题
<link>	定义文档与外部资源的关系
<style>	定义 css 样式表
<script>	定义 JavaScript 脚本
<meta>	元信息

<head>
  <link type="text/css" rel="stylesheet" href="style.css" />	
  <script type="text/javascript" charset="utf-8" src="index.js"></script>
  <title> pangugle 教程</title>
  <style type="text/css">
		p { color:blue }
  </style>
</head>

HTML - <title>元素

定义文档的标题，它是 head 部分中唯一必需的元素。

<title> pangugle 教程</title>

HTML - <link> 元素：

标签定义了文档与外部资源之间的关系，通常用于链接css样式表和设置网站小图标（*.ico）。

<link type="text/css" rel="stylesheet" href="style.css" />
<link type="image/x-icon" rel="shortcut icon" href="favicon.ico"/>

这里，rel：定义的是该文档与被链接文档之间的关系。
type：规定外部链接文档是什么打开类型。css：type="text/css"。网站小图标：type="image/x-icon"。

HTML - <style> 元素：

定义了HTML文档的样式。

<style type="text/css">
	p { color:blue }
</style>

HTML - <script> 元素：

用于加载脚本文件引用地址，如JavaScript。还可以用以下这种方式直接写脚本

<script type="text/javascript">
    console.log("你想打印的内容");
</script>

注：console.log 在控制台打印输出。

HTML - <meta> 元素：

meta 提供有关这份HTML文件的相关信息，称为元数据
元数据也不显示在页面上
通常用于指定网页的描述，关键词，文件的最后修改时间，作者，和其他元数据

1.设置编码方式，中文网站需要设置编码方式，不然页面容易乱码。

<meta charset="utf-8" />

2.name = "keywords" - 搜索引擎定义关键词

<meta name="keywords" content="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript">

3.name = "description" - 网页定义描述内容

<meta name="description" content="pangugle.com 技术教程">

4.name = "author" - 定义网页作者

<meta name="author" content="pangugle.com">

5.name = "viewport" - 定义移动端页面显示

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

用移动端打开页面时,
width=device-width 页面宽度为移动端宽度
initial-scale=1.0 页面首次被显示时无缩放
maximum-scale=1.0 页面最大缩放级别为1，也就是页面不允许放大
user-scalable=no 页面不允许用户手指缩放
注：以上实例常用于页面适配 pc 端和移动端