HTML 头部

HTML 头部指 <head> 标签及其内部的内容，它位于 <html> 之内、<body> 之前。head 里的内容不会显示在页面上，却掌管着页面的"后台信息"：标题、字符编码、样式引用、作者描述等。把 head 写对，是每个规范页面的第一步。

head 里放什么

<head> 是页面的"信息区"，常见成员有：<title>（页面标题）、<meta>（元信息）、<link>（引入外部文件）、<style>（内嵌样式）、<script>（脚本）。它们大多只服务于浏览器和搜索引擎：

<head>
  <title>示例教程 - 学的不仅是技术</title>
</head>

在浏览器中显示为：正文区看不到这些内容，但浏览器标签页上会出现"示例教程"几个字。

<title> 定义浏览器标签页、收藏夹和搜索结果中显示的标题，是 head 中最重要的标签，每个页面都应有且仅有一个：

<head>
  <title>我的第一个网页</title>
</head>

搜索引擎会以 title 内容作为搜索结果的主要标题，所以 title 要写得简洁、准确、有关键词。

<meta> 用来描述页面自身的属性，常见用法有两个：声明字符编码、填写页面描述：

<head>
  <meta charset="utf-8">
  <meta name="description" content="HTML 入门教程，零基础也能学会">
  <meta name="keywords" content="HTML,教程,网页开发">
</head>

其中 charset="utf-8" 几乎必写——不声明或声明错误，中文可能显示成乱码。

页面的样式有两种引入方式：外部 CSS 文件用 <link> 引入，少量样式可直接写在 <style> 里：

<head>
  <link rel="stylesheet" href="style.css">
</head>

<head>
  <style>
    body { background-color: #f0f0f0; }
  </style>
</head>

head 放"关于页面的信息"，body 放"页面呈现给用户的内容"，二者分工明确。新手常见的坑是把 <title>、<meta> 误写进 <body>，或把正文内容堆进 <head>——前者导致信息不生效，后者导致内容不显示，一定要放对位置。

<head> 是页面的幕后配置区：title 定标签页标题，meta 管编码与描述，link/style 引入样式。头部信息对用户不可见却至关重要，规范书写能让中文不乱码、样式正常加载、搜索更友好。

笔记加载中…

标签：#HTML