一、HTML 常见元素
a 元素
在网页中我们经常需要点击链接跳转到另外一个网站上，这个链接一般都是通过 a 元素来表示的。在 HTML 中 <a> 元素可以自定义超链接，用户打开新的 URL。
<a> 标签有两个常见的属性，分别是 href Hypertext Reference 的简称，用于指定打开的 URL 地址，也可以是一个本地的地址。
另外一个属性是 target 属性，该属性指定如何显示连接的资源，该属性的值是固定的，常用得值有：
_self：默认值，在当前的窗口中打开新的页面_blank：在一个新的窗口中打开 URL_top：在整个窗口打开_parent：在父窗口打开
点击第一个超链接：
会在当前的窗口中打开 URL 地址；
点击第二个超链接会弹出一个新的窗口打开 URL 地址；
点击第三个超链接会打开一个本地的 HTML 文件；
<a> 元素中的 href 的值除了可以为一个具体的 URL 地址，还可以是一个锚点连接，可以跳转到页面中指定的位置。
定义锚点链接首先需要在要跳转的元素上定义一个 id 属性，然后在锚点链接上也就是 <a> 元素上将 href 指定跳转元素的 id 值。
点击超链接就可以跳转到对应的位置上；
其实就是让指定位置的内容显示在窗口中；
当然除了将可以将文字作为一个超链接，也可以将一个图片作为超链接，即使用 <a> 标签来包裹一个 <img> 标签；
点击这个图片就可以跳转到稀土掘金主页
前面使用的 href 都是用来跳转网页的，但其实 href 还可以用作文件下载以及自动打开邮件发送窗口的功能；
打开页面：
点击下载超链接会自动下载链接指定的 ZIP 压缩包；
点击发送右键超链接会自动打开邮件发送界面；
iframe 元素
利用 iframe 元素可以在 HTML 文档中嵌入其他的 HTML，iframe 元素有一个 frameborder 属性用于规定是否显示边框，该属性只有两个值，1 表示显示边框；0 便是不显示边框；
打开页面会出现一个内嵌的窗口显示 src 属性的 URL 页面；
也可以通过添加 width 和 height 属性来设置窗口的大小；
重新打开，可以看到窗口的大小发生了变化；
iframe 与 a 元素 href 属性的 _parent 和 _top
前面 a 元素中我们只讲到了 href 属性的 _blank 值和默认的 _self 值，这里我们可以结合 iframe 来演示 a 元素 href 属性的 _parent 值和 _top 值。
首先在 01_HTML 常见元素 文件夹中创建一个 others 文件夹，在该文件夹中创建两个 HTML 文件，具体代码如下：
设置 a 元素的 target 属性为 _top：
设置 iframe 元素的 frameborder 属性为 1：
再在 others 同级目录下创建一个 HTML 文件，并设置 iframe 元素的 frameborder 值为 1：
在浏览器中打开这个文件：
该文件包含两个边框，是一个多级嵌套文件，此时点击超链接可以看到在整个窗口中打开了 URL；
接着将 others 文件夹下文件中的 a 元素的 target 属性设置为 _parent，即只在父窗口中打开，点击超链接
div 元素和 span 元素
不管是 h 元素还是 a 元素或者 p 元素，这些元素都具有很强的语义性，即当我们需要一个标题时，就会想到使用 a 元素，当需要展示一个段落时就会想到使用 p 元素。
在最初没有 CSS 的时候，是通过添加各种各样的包含样式的 HTML 元素来实现网页的，比如 a 元素、p 元素等，随着这种包含样式的元素越来越多，导致无法搞清楚哪些是搭建 HTML 的基本元素，哪些是用于添加样式的元素。
在 HTML 中有两个特殊的元素 div 元素和 span 元素，这两个元素是不包含任何样式的，所以这两个元素可以用在任何地方，因此使用 div/span 的方式可以用来搭建 HTML 结构，使用 CSS 专门用来处理样式。
div 元素和 span 元素都是纯粹的 容器 元素，我们可以把他们理解成一个 盒子，专门用来包裹内容的，区别如下：
- div 元素：多个 div 元素包裹的内容会在不同的行显示，也就是一块一块的，一个 div 元素就是一个整体，可以用于把网页分成几个独立的部分
- span 元素：多个 span 元素包裹的内容会在同一行显示，与普通文本无差别，可以通过添加样式用来区别或者显示一些关键字
创建一个新的 HTML 文件，分别使用 div 元素、span 元素以及 p 元素搭建 HTML 结构，具体代码如下：
在浏览器中打开页面，可以看到 div 元素包裹的内容都是独立的一块内容，而 span 元素包裹的元素都是在一行显示的，并且与 p 元素一段一段的内容是不一样的
span 元素常用于强调内容，因此我们可以给第一个 span 元素添加一个 class 属性，并通过 CSS 选择器给这个 class 添加一些样式，用于强调或者区别文字内容，具体代码如下：
在浏览器中打开该页面，可以看到第一部分 span 内容明显与其他内容样式不一样，这就实现了关键内容的区分或者强调。
div 元素和 span 元素在以后 HTML 页面的开发中使用会非常频繁。
