- HTML 是英文 Hyper Text Markup Language（超文本標(biāo)記語言）的縮寫。
大部分 HTML 元素都有一個(gè)開始標(biāo)記和一個(gè)結(jié)束標(biāo)記。
開始標(biāo)記像這樣：
<h1>
結(jié)束標(biāo)記像這樣：
</h1> - h1元素通常被用作主標(biāo)題，h2元素通常被用作副標(biāo)題，還有h3、h4、h5、h6元素，它們分別用作不同級(jí)別的標(biāo)題。
<h1>Hello World</h1>
<h2>CatPhotoApp</h2>
- 用 p 元素代表段落
p是paragraph的縮寫，通常被用來創(chuàng)建一個(gè)段落，就和你寫作文一樣。
你可以像這樣創(chuàng)建一個(gè)段落：
<p>I'm a p tag!</p> - 用占位符文本填充空白
Web 開發(fā)者通常用lorem ipsum text來做占位符，占位符就是占著位置的一些文字，沒有實(shí)際意義。
為什么叫lorem ipsum text呢?是因?yàn)?code>lorem ipsum是古羅馬西塞羅諺語的前兩個(gè)單詞。 - 去除 HTML 的注釋
注釋的作用是給代碼添加一些說明，方便團(tuán)隊(duì)合作或日后自己查看，但又不影響代碼本身。
注釋也可以用來在不刪除代碼的前提下，讓代碼不起作用。
在HTML中，注釋開始的標(biāo)記是
<!--
結(jié)束標(biāo)記是-->。
HTML5 元素介紹
HTML5 引入了很多更具描述性的 HTML 元素，例如：header、footer、nav、video、article、section等等。
這些元素讓 HTML 更易讀，同時(shí)有助于搜索引擎優(yōu)化和無障礙訪問。
main元素讓搜索引擎和開發(fā)者瞬間就能找到網(wǎng)頁(yè)的主要內(nèi)容。給網(wǎng)站添加圖片
用img元素來為你的網(wǎng)站添加圖片，其中src屬性指向一個(gè)圖片的地址。
例如：
<img src="https://www.your-image-source.com/your-image.jpg">
注意：img元素是沒有結(jié)束標(biāo)記的。
所有的img元素必須有alt屬性，alt屬性的文本是當(dāng)圖片無法加載時(shí)顯示的替代文本，這對(duì)于通過屏幕閱讀器來瀏覽網(wǎng)頁(yè)的用戶非常重要。
注意：如果圖片是純裝飾性的，用一個(gè)空的alt是最佳實(shí)踐。
理想情況下，alt屬性不應(yīng)該包含特殊字符，除非需要。
讓我們給上面例子的img添加alt屬性。
<img src="https://www.your-image-source.com/your-image.jpg" alt="作者站在沙灘上豎起兩個(gè)大拇指">
- 用錨點(diǎn)實(shí)現(xiàn)網(wǎng)頁(yè)間的跳轉(zhuǎn)
你可以用a錨點(diǎn)（Anchor，簡(jiǎn)寫 a）來實(shí)現(xiàn)網(wǎng)頁(yè)間的跳轉(zhuǎn)。
錨點(diǎn)需要一個(gè)href屬性指向目的地，它還需要有錨點(diǎn)文本，例如：
<a >傳送至 freecodecamp.one</a>
然后你的瀏覽器會(huì)顯示一個(gè)可以點(diǎn)擊的文本，點(diǎn)擊該文本就會(huì)跳轉(zhuǎn)到https://freecodecamp.one。
<a >傳送至 cat photos</a>
- 用錨點(diǎn)實(shí)現(xiàn)網(wǎng)頁(yè)內(nèi)部跳轉(zhuǎn)
錨點(diǎn)同樣也可以用來在網(wǎng)頁(yè)內(nèi)不同區(qū)域的跳轉(zhuǎn)。
設(shè)置錨點(diǎn)的href屬性值為井號(hào)#加上想跳轉(zhuǎn)區(qū)域?qū)?yīng)的id屬性值，這樣就可以創(chuàng)建一個(gè)內(nèi)部跳轉(zhuǎn)。id是用來描述網(wǎng)頁(yè)元素的一個(gè)屬性，它的值在整個(gè)頁(yè)面中唯一。
下面是用來創(chuàng)建內(nèi)部錨點(diǎn)的例子：
<a href="#contacts-header">Contacts</a>
...
<h2 id="contacts-header">Contacts</h2>
當(dāng)用戶點(diǎn)擊了Contacts鏈接，頁(yè)面就會(huì)跳轉(zhuǎn)到網(wǎng)頁(yè)的Contacts區(qū)域。
- 將錨點(diǎn)嵌套在段落中
你可以在其他文本元素內(nèi)嵌套鏈接。
> <p>
> Here's a <a target="_blank" > link to freecodecamp.one</a> for you to follow.
> </p>
讓我們來分解這個(gè)例子：
通常，文本是被包裹在p段落內(nèi)：
<p> Here's a ... for you to follow. </p>
接下來是anchor錨點(diǎn)<a>（需要結(jié)束標(biāo)記 </a>）:
<a> ... </a>
target是錨點(diǎn)的一個(gè)屬性，它指定了會(huì)以什么方式來打開鏈接，屬性值 "_blank"的意思是鏈接會(huì)在新元素頁(yè)打開。
href是錨點(diǎn)的另一個(gè)屬性：它指定了鏈接的 URL 地址：
<a > ... </a>
錨點(diǎn)元素內(nèi)的文本："link to freecodecamp.one"，會(huì)顯示為一個(gè)可以點(diǎn)擊的鏈接：
<a href=" ... ">link to freecodecamp.one</a>
例子的最后輸出將會(huì)是這樣：
Here's a link to freecodecamp.one(http://freecodecamp.one/) for you to follow.
