结构分析

<head> 标签里存储网页的配置信息

title 网页的标题
<meta> 标签
- 设置网页的字符编码

常用的元素

<p> <h>：标题（h1 - h6）、段落
- 样式的呈现方式只是浏览器解析的时候给标签加上 CSS 样式而已
- 可以通过 Chrome 的检查功能验证
- <h> 元素通常和 SEO 优化有关
<img>：图片
- <img> 是一个可替换元素，把一个元素用另一个资源替换
- src：图片来源
- alt：当图片加载不成功时显示这段文本或结合屏幕阅读器使用
- 图片格式：常见格式都支持（jpg, gif, svg, webp ……）

<aside> 💡 图片的路径

网络图片：直接填写图片地址（如图床）
本地图片：
- 绝对（Absolute）路径：从根盘符开始查找，一直找到这个资源
- 相对（Relative）路径
路径一般用 / ，只有 Windows 会用 \\ </aside>

<a>：Anchor，定义超链接，用于打开新的 URL
- href：指定打开的 URL 地址，也可以是一个本地地址
- target：以何种方式打开链接
  - _self：当前页打开
  - _blank：空白页打开
- 指向本页面的锚点链接
  - 在想要跳转到的元素上添加 id
  - <a href="id">跳转到该元素</a>
- a 元素和 img 元素结合使用：a 元素内部可以嵌套 img 元素
<iframe>：在页面中嵌套其他页面
- src：页面地址
- frameborder：边框粗细
- 结合 a 标签使用：self parent top，分别表示超链接在哪里打开
- 弊端：很多网站会限制其他网站使用 iframe
<div>：Division，分开，分配的意思。一般在不同行显示
<span>：跨越、涵盖的意思。一般在同一行表示

<aside> 💡 为什么需要 <div><span> 标签？

补充，视频15节

Untitled

</aside>

不常用的元素
- <strong>：通常加粗会使用 CSS 样式来完成
- <i>：倾斜文字
- <code>：显示代码，偶尔会用来显示等宽字体
- <br>：换行元素，开发中已经不使用

HTML 全局属性

一些属性是所有 HTML 元素都可以设置的

class：类名，可以添加多个，以空格分隔
id：定义唯一标识符，一般类名唯一，一个标签一般也只有一个id
style：给元素添加内联样式
title：某一个元素，用户将鼠标放上去时会得到提示