dl、dt、dd數據列表
現在讓我們來看看使用了HTML dl、dt、dd標籤的數據列表。首先我們使用dl(definition list-自定義列表)標籤來容納整個數據結構，然後我們使用dt(自定義標題)標籤和dd(自定義描述)標籤來容納數據中的標題和內容。
<dl>
<dt>Name: </dt>
<dd>Squall Li</dd>
<dt>Age: </dt>
<dd>23</dd>
<dt>Gender: </dt>
<dd>Male</dd>
<dt>Day of Birth:</dt>
<dd>26th May 1986</dd>
</dl>
而在css代碼中，我們僅需讓dt和dd向左浮動即可。
/*DL, DT, DD TAGS LIST DATA*/
dl {
margin-bottom:50px;
}
dl dt {
background:#5f9be3;
color:#fff;
float:left;
font-weight:bold;
margin-right:10px;
padding:5px;
width:100px;
}
dl dd {
margin:2px 0;
padding:5px 0;
}
從dl、dt、dd的實例中你應該能明顯的看出它們的代碼更簡潔更平滑更符合語義化了吧。
