第HTML列表中的dl,dt,dd,ul,li,ol區(qū)別及應用平時有時候用到div和css對網(wǎng)站界面進行重構(gòu),經(jīng)常會用到標簽ulollidldtdd,這些標簽常用于列表顯示內(nèi)容.

學會這幾個標簽的用途,了解一下他們的區(qū)別,對網(wǎng)站代碼和加載速度都有很有益處的.

下面,簡單說一下.

ul標簽定義無序列表。

實例:

ul:unorderedlists

ol:orderedlists

li:Lists

ol有序列表:

li/li

li/li

li/li

/ol

表現(xiàn)為：

1

2

3

ul無序列表，表現(xiàn)為li前面是大圓點而不是123:

li/li

li/li

/ul

很多人容易忽略dldtdd的用法:

dl內(nèi)容塊

dt內(nèi)容塊的標題

dd內(nèi)容

可以這么寫：

dt標題/dt

dd內(nèi)容1/dd

dd內(nèi)容2/dd

/dl

dt和dd中可以再加入olulli和p,理解這些以后，在使用div布局的時候，會方便很多，w3c提供了很多元素輔助布局。

LI代碼的格式化:

A).運用CSS格式化列表符：

ulli{

list-style-type:none;

}

B).如果你想將列表符換成圖像，則：

ulli{

list-style-type:none;

list-style-image:url(/blog/images/icon.gif);

}

C).為了左對齊，可以用如下代碼：

list-style-type:none;

margin:0px;

}

D).如果想給列表加背景色，可以用如下代碼：查看更多css教程

list-style-type:none;

margin:0px;

ulli{

background:#CCC;

}

E).如果想給列表加MOUSEOVER背景變色效果，可以用如下代碼：

ul{list-style-type:none;margin:0px;}

ullia{display:block;width:100%;background:#ccc;}

ullia:hover{background:#999;}

說明：display:block;這一行必須要加的，這樣才能塊狀顯示！

F).LI中的元素水平排列,關(guān)鍵FLOAT:LEFT：

list-style-type:none;

width:100%;

ulli{

width:80px;

float:left;

}

ulli的區(qū)別

LI的參數(shù)設定（常用）：

例如：litype=squarevalue=4

type=square

只適用于非順序清單，設定符號款式，其值有三種，如下，內(nèi)定為type=disc：

以下是引用片段：

符號是當type=disc時的列項符號。

符號ifwidth=10height=10border=0是當type=circle時的列項符號。

符號是當type=square時的列項符號。

value=4

只適用于順序清單，設定該一項的數(shù)目，其後各項將以此作為起始數(shù)目而遞增，但前面各項則不受影響，其值只能是1,2,3..等整數(shù)，沒有內(nèi)定值。

UL稱為無序清單標記。

所謂無序清單就是在每一項前面加上、、等符號，故又稱符號清單。

UL的參數(shù)設定（常用）：

例如：ULtype=square

type=square

設定符號款式，其值有三種，如下，內(nèi)定為type=disc：

以下是引用片段：

符號是當type=disc時的列項符號。

符號是當type=circle時的列項符號。

符號是當type=square時的列項符號。

ul是項目列表，li是列表項，項目列表就是用符號來列的，所以你列出來默認的就是黑點，還有一個是ol這個是編號列表，用數(shù)字來列的，也是用li做列表項