HTML結構
一個HTML包含以下部分：
- 文檔類型聲明
- html元素
- head元素
- body元素
例（CSDN）：
一、文檔類型聲明
HTML最一方的文檔稱為：文檔類型聲明，用于聲明文檔類型。即：<!DOCTYPE html>
<!DOCTYPE html> 的作用：
- HTML文檔聲明，用于告訴瀏覽器是HTML5頁面。
- 讓瀏覽器用HTML5的標準去解析。
- 必須放在最最前面，不可以省略。否則可能有兼容性問題。
二、html元素
1、 <html>元素
表示一個HTML 文檔的根（頂級元素），也成為根元素。
其他元素必須是這個元素的后代。
2、一般都會加一個 lang屬性
lang屬性的作用：
- 定義當前HTML文檔的語言
- 幫助語音合成工具確定要使用的發音。
- 幫助翻譯工具確定要使用的翻譯規則。
常用lang屬性的規則：
lang="zh-CN"：表示這個HTML文檔的語言是中文。lang="en"：表示這個HTML文檔的語言是英文。
例（CSDN）：
三、head元素
1、 <head>元素
規定文檔的配置信息（也成為元數據），包括文檔的標題，引用的文檔樣式、腳本信息等等。
- 元數據：描述數據的數據，可以理解為整個頁面的配置。
常見的設置：
title元素
設置網頁的標題。meta元素
設置網頁的編碼。即：<meta charset=utf-8">，一般都是utf-8編碼。
?meta元素是用來讓機器識別元數據的。
?有各種元素類型。例如name & content可以指定元數據的名稱（這部分對 SEO 非常有用）等等。
例（CSDN）：
四、body元素
body元素里面的內容是 在瀏覽器窗口中看到的東西，也就是網頁的具體內容和結果。
五、常用元素
h元素
h：即heading，標題。
作用：將一些重要文字作為標題。<h1>到<h6>：六種不同級別。
<h1>級別最高，<h6>級別最低。
h元素通常和SEO優化有關。
p元素
p：即paragraph，段落。
作用：表示文本的一個段落的時候使用。- 多個段落之間會存在間距。
img元素
-
作用：將圖片嵌入文檔。告訴瀏覽器顯示圖片。
-
<img>常見的兩個屬性：-
src屬性：
是必須的。
包含你想嵌入圖片的路徑。 -
alt屬性
不是強制的。有兩個作用：
①如果圖片加載失敗（圖片地址錯誤或者圖片不存在），那么會顯示這段文本。
②屏幕閱讀器會都這段文字給使用者，指導這張圖的含義。 -
其他屬性也都可以，例如：
width屬性
-
-
圖片的路徑
src- 網絡圖片：給一個網絡的URL就行。很簡單。
- 本地圖片：己電腦上的圖片。
本地圖片的地址分兩種：
①絕對路徑（幾乎不用）
從電腦的本目錄開始一直找到資源路徑。
②相對路徑
對于當前文件而言的一個路徑。
.：代表當前文件夾，可省略。
..：代表上一層的文件夾，可省略。 - 注意路徑分割都是
/。
<img src="./../images/test.jpg" alt="">
img支持的圖片格式
a元素
-
作用：需要跳轉到某個鏈接的時候使用
a元素。 -
<a>元素：定義超鏈接，用于打開新的URL。 -
<a>元素兩個，常見的屬性：href屬性
指定要打開的URL。
也可以是一個本地地址。target屬性
指定在何處顯示鏈接的資源。
①_self：在當前窗口打開。
②_blank：在新的窗口打開。
③_parent：在父窗口打開。（單獨使用沒效果，需要和iframe元素配合使用。）
④_top：在最頂層窗口打開。（單獨使用沒效果，需要和iframe元素配合使用。）
-
a元素：設置錨點鏈接- 作用：跳到網頁的某個位置。（例如：目錄跳轉）
- 具體步驟：
①在要跳的的元素上定義一個id屬性
②定義a元素，讓他的href指向對應的id。
-
a元素：設置圖片鏈接- 作用：點擊某個圖片，跳轉到指定鏈接。
- 具體步驟：
①定義a元素，它的內容放一個img元素。（也就是img元素就是a元素的內容。）
②指定href，設置想跳轉的地址。
iframe元素
在一個HTML文檔中嵌入另一個HTML文檔。
div元素
div元素：就是一個容器，或者說盒子。用來包裹內容。- 作用：
①div包裹的內容在不同行顯示。包裹的這部分是一個整體。
②把網頁分割成多個獨立的部分。
span元素
span元素：就是一個容器，或者說盒子。用來包裹內容。- 作用：
①span包裹的內容在同一行顯示。包裹的這部分和普通文本沒區別。
②用于區分特殊文本和普通文本，主要用來顯示關鍵字。
六、不常用元素
strong元素
- 作用：內容加粗，強調。
通常都是用css來完成。
i元素
- 作用：內容傾斜。
通常都是用css來完成。
code元素
- 作用：用于顯示代碼
br元素
- 作用：換行
