dl 標簽 -- 代表HTML自定義列表
dl標簽是成對出現的,以<dl>開始,</dl>結束
自定義列表的開始使用<dl>標簽,列表中每個元素的標題使用<dt>(definition term)定義,后面跟隨<dd>(definition description)用於描述列表中元素的內容.
屬性:
Common -- 一般屬性
dl是definition lists的英文縮寫
<dl><dt></dt><dd></dd></dl>為常用標題+列表型標簽。如沒有對dl dt dd標簽初始CSS樣式,默認dd列表內容會一定縮進。(擴展閱讀:ul li、ol li、li列表)
< dl>< /dl>用來創建一個普通的列表,
< dt>< /dt>用來創建列表中的上層項目,
< dd>< /dd>用來創建列表中最下層項目,
< dt>< /dt>和< dd>< /dd>都必須放在< dl>< /dl>標志對之間。
<dl>
<dt>列表標題</dt>
<dd>列表內容</dd>
<dd>列表內容</dd>
...
</dl>
語法解釋:
首先dt和dd是放於dl標簽內,標簽dt與dd處於dl下相同級。也就是dt不能放入dd內,dd不能放入dt內。在dl下,dt與dd處於同級標簽。DD標簽可以若干。同時不能不加dl地單獨使用dt標簽或dd標簽。
1 <html> 2 <head> 3 <style> 4 *{ margin:0; padding:0;} 5 #box{ width:300px; margin:10px; padding:10px; float:left; border:1px solid #CCC; 6 background:#FFFFCC; font-size:12px; line-height:1.9;} 7 dl{ background:#CCCC00; margin:0; width:120px; 8 text-align:center; float:left; margin:5px;} 9 dt{ background:#CC0033;}dt img{display:block; 10 margin:0 auto;} 11 dd{ background:#FFFF00; } 12 </style> 13 </head> 14 <h3>自動換行</h3> 15 16 <table width="100%" border="1" align="center"> 17 <div id="box"> 18 <dl> 19 <dt> <img src="door_nosensor.jpg" /> </dt> 20 <dd>10.0.1.201-1</dd> 21 </dl> 22 <dl> 23 <dt> <img src="door_nosensor.jpg" /> </dt> 24 <dd>10.0.1.201-2</dd> 25 </dl> 26 <dl> 27 <dt> <img src="door_nosensor.jpg" /> </dt> 28 <dd>10.0.1.201-3</dd> 29 </dl> 30 <dl> 31 <dt> <img src="door_nosensor.jpg" /> </dt> 32 <dd>10.0.1.201-4</dd> 33 </dl> 34 35 </div> 36 </table> 37 </html>