html中dl,dt,dd,ul,li,ol標簽區別和使用

時間：2013-04-12 21:48 來源:未知 | 作者:易享學習網

| 本文已影響 人

ul: unordered lists

ol: ordered lists

li: Lists

ol 有序列表:

……

……

……

表現為：

1……

2……

3……

ul 無序列表，表現為li前面是大圓點而不是123:

• ……
• ……

很多人容易忽略 dl dt dd的用法:

dl 內容塊

dt 內容塊的標題

dd 內容

可以這么寫：

標題

內容1

內容2

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

LI代碼的格式化:

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

以下是引用片段：

ul li{

list-style-type:none;

}

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

以下是引用片段：

ul li{

list-style-type:none;

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

}

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

以下是引用片段：

ul{

list-style-type:none;

margin:0px;

}

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

以下是引用片段：

ul{

list-style-type: none;

margin:0px;

}

ul li{

background:#CCC;

}

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

以下是引用片段：

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

ul li a{ display:block; width: 100%; background:#ccc; }

ul li a:hover{ background:#999; }說明：display:block;這一行必須要加的，這樣才能塊狀顯示！

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

以下是引用片段：

ul{

list-style-type:none;

width:100%;

}

ul li{

width:80px;

float:left;

}

• 的區別
• 的參數設定(常用)：

  例如：

• type="square"

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

  以下是引用片段：

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

  符號 if" width=10 height=10 border=0> 是當 type="circle" 時的列項符號。

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

  value="4"

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

  • 稱為無序清單標記。

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

  • 的參數設定(常用)：

  例如：

  type="square"

  設定符號款式，其值有三種，如下，內定為 type="disc"：

  以下是引用片段：

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

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

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

  • 是項目列表，
  • 是列表項，項目列表就是用符號來列的，所以你列出來默認的就是黑點，還有一個是
  • 這個是編號列表，用數字來列的，也是用
  • 做列表項
  • 是 list item 即列表項，但列表有很兩種，所以外面得有
    • 或者
  • 用來區別無序列表(小點點)和有序列表(1,2,3...)。

  (責任編輯：我愛學習網)

  更多技巧文章請關注公眾號：huixiang_360

  分享到：

  更多

總結

以上是生活随笔為你收集整理的html中dl标签和ul标签,html中dl,dt,dd,ul,li,ol标签区别和使用的全部內容，希望文章能夠幫你解決所遇到的問題。

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