HTML 头部

  • <head> 的内容不会在浏览器中显示,它的作用是包含一些页面的元数据。
  • 元数据 (Metadata): 描述数据的数据 (a set of data that describes and gives information about other data)
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>饥人谷前端</title>
</head>
  • <head> 是用来表示整个HTML文档大致内容的元数据(不是文档的内容)

元数据 <meta>

指定文档编码

<meta charset="utf-8">

告诉浏览器当前页面的内容使用的是utf-8编码,浏览器需要使用utf-8来解码,否则对于中文等特殊符号会出现乱码。

关于编码和乱码,可参考这篇文章

适配移动页面

<meta name="viewport" content="width=device-width, initial-scale=1.0">

告诉浏览器,当前页面要适配移动端,关于viewport的介绍,可参阅这篇文章。后续课程会继续深入讲解。

定制页面图标

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

设置 referer

<meta name="referrer" content="never">

添加页面描述

<meta name="description" content="饥人谷,专业有爱的前端培训机构">
<meta name="keyword" content="饥人谷 前端 Java"

便于搜索引擎检索。

应用 CSS 和 JS

<link rel="stylesheet" href="app.css">
<script src="app.js"></script>

参考链接

results matching ""

    No results matching ""