HTML 列表標籤

2022-09-03 05:39:10 字數 2236 閱讀 4616

列表就相當於去超市購物時的那個購物清單,

在html也可以建立列表,在網頁中一共有三種列表:

1.無序列表

2.有序列表

3.定義列表

無序列表

- 使用ul標籤來建立乙個無序列表

- 使用li在ul中建立乙個乙個的列表項,

乙個li就是乙個列表項

通過type屬性可以修改無序列表的專案符號

可選值:

disc,預設值,實心的圓點

square,實心的方塊

circle,空心的圓

注意:預設的專案符號我們一般都不使用!!

如果需要設定專案符號,則可以採用為li設定背景的方式來設定

ul和li都是塊元素   

有序列表

有序列表和無序列表類似,只不過它使用ol來代替ul

有序列表使用有序的序號作為專案符號

type屬性,可以指定序號的型別

可選值:1,預設值,使用阿拉伯數字

a/a 採用小寫或大寫字母作為序號

i/i 採用小寫或大寫的羅馬數字作為序號

ol也是塊元素   

列表之間都是可以互相巢狀,可以在無序列表中放個有序列表,也可以在有序列表中放乙個無序列表

定義列表

義列表用來對一些詞彙或內容進行定義

使用dl來建立乙個定義列表

dl中有兩個子標籤

dt : 被定義的內容

dd : 對定義內容的描述

同樣dl和ul和ol之間都可以互相巢狀   

1

doctype html

>

2<

html

>

3<

head

>

4<

meta

charset

="utf-8"

>

5<

title

>

title

>

6<

style

type

="text/css"

>78

/*9去掉專案符號

10*

*/11

/*ul

*/14

15style

>

16head

>

17<

body

>

1819

2627

44<

ul>

45<

li>西門大官人

li>

46<

li>柴大官人

li>

47<

li>許大官人

li>

48<

li>唐僧大官人

li>

49ul

>

5051

61<

ol type

="i"

>

62<

li>結構

li>

63<

li>表現

li>

64<

li>行為

li>

65ol

>

6667

7172

<

p>菜譜

p>

73<

ul>

74<

li>

75魚香肉絲

76<

ol>

77<

li>魚

li>

78<

li>香

li>

79<

li>肉絲

li>

80ol

>

81li

>

82<

li>

83宮保雞丁

84<

ul>

85<

li>宮保

li>

86<

li>雞丁

li>

87ul

>

88li

>

89<

li>青椒肉絲

li>

90ul

>

9192

body

>

93html

>

view code

HTML 列表標籤

列表分為兩種型別,即無序列表和有序列表。前者用專案符號來標記列表項,而後者則使用編號來記錄專案的順序。列表的主要標籤 標籤 描述說明 type 為無序列表的屬性 type 的屬性值有 circle,disc,square 含義分別為 空心圓,實心圓和實心正方形 定義列表包含兩個層次的列表 第一層次是...

HTML列表標籤

給一堆內容新增無序列表語義 乙個沒有先後順序整體 列表中的條目是不分先後 北京li 上海li 深圳li 武漢li ul 導航條 商品列表 新聞列表 這裡指的無序是指對於主體來說內容沒有先後之分 瀏覽器會給無需列表自動新增先導符號但是一定一定千萬千萬要記住,ul的作用並不是給文字新增小圓點,而是增加無...

HTML 列表標籤

課程 超級文字標記語言 英文縮寫 html 是為 網頁建立和其它可在網頁瀏覽器中看到的資訊 設計的一種標記語言。超文字標記語言,標準通用標記語言下的乙個應用。是 網頁製作必備的程式語言 超文字標記語言的結構包括 頭 部分 英語 head 和 主體 部分 超文字標記語言,標準通用標記語言下的乙個應用。...