一、Html的基本結構：

網頁的文本、圖片等信息；

二、Head部分：用于表示網頁的元數據即描述網頁的基本信息

其常用標簽及屬性有：

1、title標簽：瀏覽器標簽頁顯示的標題

2、meta標簽：其常用屬性

①charset:設置文檔的字符集編碼格式。HTML5中設置字符集編碼：

常見的字符集編碼格式：

a.GB-2312:國標碼，簡體中文

b.GBK：擴展的國標碼

c.UTF-8：萬國碼 Unicode 常用

②http-equiv屬性:將我們的信息寫給瀏覽器看，讓瀏覽器按照這里面的要求執行，可選屬性值：Content-Type(文檔類型)?refresh(網頁定時刷新)?set-cookie(設置瀏覽器cookie緩存) 需要配合content屬性使用。(http-equiv屬性只是表明需要設置哪一部分，具體的設置內容，放到content屬性中)

③name屬性：使用方法同“http-equiv”。將我們的信息寫給搜索引擎看

常用且需要掌握的屬性值：author(作者)?keywords(網頁關鍵字)?description(網頁描述) 這兩個屬性設置，網頁必不可少。

3、link標簽：鏈接網頁圖標(title前的小logo)，其常用屬性有：

①rel屬性：聲明鏈接文件的類型，此處選icon

②type屬性：可以省略

③href屬性：表示圖片的路徑地址

三、body部分：網頁的文本、圖片等信息

標簽的分類：

塊級標簽：顯示為塊，前后隔一行(自動換行)

行級標簽：按行從左往右逐一顯示。

1、 常見的塊級標簽：

①

......

：標題標簽，自動加粗，h1最大，h6最小。

②

---

：水平線標簽，添加一條水平線。

③

④
:換行標簽，

⑤

:引用標簽，cite屬性，表明引用的來源，一般引用網址

瀏覽器默認首行縮進。

⑥

:預格式標簽，用于重載代碼。瀏覽器默認顯示樣式：1、顯示為等寬字體。 2、代碼中的換行、

空格等元素能在瀏覽器中顯示。

【補充】html 文件中空格的表示：

2、 基于布局的塊級標簽

列表：無序列表、有序列表、定義列表

①有序列表：

列表項：

②無序列表：

③定義列表(實現圖文混排):

列表標題：

一般只有一項

列表描述項：

可以有很多項

3、組合標簽：

用于顯示圖片及圖片標題

他有兩個子標簽：圖片

圖片的標題

例如：

探險家 伊澤瑞爾

4、分區標簽：

5、常見的行級標簽

<1>span(文本):無實際意義，用于包裹某部分文字，修改特定樣式，例如：

這是span中的文字

img(圖片)：其常用屬性：①src:表示引用圖片的地址。

路徑地址的寫法：相對路徑：以當前文件為最準，去尋找圖片地址

a、與文件處于同一層的圖片，直接寫圖片名

b、圖片在當前文件下一層：文件名/圖片名

c、圖片在當前文件上一層：../圖片名

絕對路徑:file:///盤符：/文件夾/圖片名，但 是嚴禁使用

圖片網址：網絡上的圖片鏈接，但是一般不用

②height和width：圖片的高度和寬度?？梢杂肅SS樣式代替

③title：圖片標。當鼠標指上之后顯示的文字

④alt:當圖片無法顯示的時候，顯示的文字

<2>em(傾斜強調)

<3>strong(加粗強調)

<4>b(加粗)

<5>i(傾斜)

Strong、em、b、i的區別

1、Strong、em都表示強調，Strong為粗體，em為斜體，而Strong的強調 程度逗比em高

2、Strong和b都能加粗，em和i都能傾斜，，但是Strong和em多了一層強調的語義 。H5要求標簽盡可能實現語義化。

<6>q(短引用)

<7>small/big(縮小/放大字體)：small和big分別是縮小和擴大字體，都可以多層嵌套直至上限或下限

<8>a(超鏈接)

1、href:超鏈接的路徑，可以是網絡鏈接，也可以是本地文件。

2、target:跳轉頁面打開的位置。_self自身頁面，_blank新頁面。

3、title:鼠標指在超鏈接上顯示的名稱。

4、Rel(被鏈接是當前的前/后一篇):指定被鏈接文檔與當前文檔的關系,搜索引擎 會利用該屬性 獲取更多的有關鏈接的信息：

rel="prev"被鏈接文檔是當前文檔的前一篇文 檔，

rel="next"被鏈接文檔是當前文檔的后一篇文檔,

rel="icon"被鏈接文檔是當前文檔的圖標

rel="stylesheet"被鏈接文檔是當前文檔的樣式表

5、Rev(當前是被鏈接的前/后一篇)

錨鏈接：

①本頁面錨鏈接:a、設置錨點：

b、跳轉錨點：#name名

①頁面間錨鏈接:a、在即將跳轉頁面的指定位置設置錨點

b、跳轉錨點：頁面地址.html#name名

頁面間錨鏈接

功能性鏈接： mailto用于給指定郵箱發送郵件

file：///e:/aaa.png打開本地文件

tencent://message/?uin=1315618220 給指定QQ發送息

<9>s標簽，有誤文本：刪除線

這是S標簽中的文字

<10>cite標簽：瀏覽器顯示為傾斜，常用于書、畫作、作品的引用

這是cite中的文本

<11>code:計算機代碼，不保留代碼格式

<12>bdo:表示文本方向，屬性：dir="ltr"表示從左往右，dir="rtl"表示從右往左

1234567

kbd:表示需要用戶用鍵盤輸入的內容，瀏覽器顯示為等寬字體

請輸入“Esc”推遲系統

<13>sup:上標文本，sub:下標文本

x₆

? ? 空格

? ? 空格 ?

<14>u:下劃線

這是下劃線

mark:高亮或標記文本，瀏覽器顯示為黃色背景

mark

總結

以上是生活随笔為你收集整理的HTML5中常见的列表标签包括,介绍几个常用的HTML5标签的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。