欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

DD DT DL標(biāo)簽使用示例

  發(fā)布時間：2013-09-04 18:09:11   作者：佚名   我要評論
我們平時常用的是ul li標(biāo)簽，不過dd、dt標(biāo)簽也蠻不錯，主要實在有功能模塊列表什么的可以使用它來排版，下面為大家介紹個示例講解下dd、dt標(biāo)簽的具體的使用方法，感興趣的朋友額可以參考下
我們平時常用的是< ul>< li>標(biāo)簽，不過dd、dt標(biāo)簽也蠻不錯，特別是發(fā)布程序的時候功能模塊列表什么的可以使用它來排版。

<dl>< /dl>< dt>< /dt>< dd>< /dd>
<dl>< /dl>用來創(chuàng)建一個普通的列表,< dt>< /dt>用來創(chuàng)建列表中的上層項目，< dd>< /dd>用來創(chuàng)建列表中最下層項目，< dt>< /dt>和< dd>< /dd>都必須放在< dl>< /dl>標(biāo)志對之間?？匆幌孪逻叺睦幽蜁靼琢耍?

dl ——define list——定義列表
dt ——define list title——用于生成定義列表中各列表項的標(biāo)題，重復(fù)使用可以定義多個列表項的標(biāo)題。
dd——define list define——用于生成定義列表各列表項的說明文字段，重復(fù)使用可以定義多個說明文字段。dd是對應(yīng)dt的簡短說明或解

例子：

復(fù)制代碼
代碼如下:

<dl>
<dt>Today
<dd>Today is yesterday.
<dt>Tomorrow
<dd>Tomorrow is today.
</dl>

例子2：

復(fù)制代碼
代碼如下:

<html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>無標(biāo)題文檔</title>
<style type="text/css">
<!--
dt {
float: left;
width: 60px;
margin: 0px;
padding: 0px;
}
dd {
float: left;
clear: none;
width: 290px;
margin: 0px;
padding: 0px;
}
dl {
width: 350px;
font-size: 9pt;
line-height: 1.5em;
position:relative;
margin: 0px;
padding: 0px;
left:15px;
}
.red {
color: #FF3300;
}
#box {
width: 500px;
background-color: #F1F1F7;
}
#box #content {
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 20px;
}
-->
</style>
</head>
<body>
<div id="box">
<div id="content">
<img src=/Article/UploadFiles/200704/20070412091408274.gif align="left"/ >
<dl>
<dt>商品名稱：</dt>
<dd><strong>[好大的一只啊] </strong>憂惠：<span class="red"><em>8.5折</em></span></dd>
<dt>商品簡介：</dt>
<dd>商品名稱商品名稱商品品名稱商品名稱商品名稱商品名稱商品名稱商品名稱商品名稱商品名稱商品品名稱商品名稱商品名稱商品名稱商品名稱 商品名稱商品名稱商品名稱商品品名稱商品名稱商品名稱商品名稱商品名稱商品名稱……[<span class="red";>詳細(xì)介紹</span>]</dd>
<dt>店鋪地址：</dt>
<dd>商品名稱</dd>
<dt>聯(lián)系電話：</dt>
<dd>0000-12345678 87654321 </dd>
</dl>
</div>
</div>
</body>
</html>

相關(guān)文章

  • HTML 表格詳解（簡單易懂較詳細(xì)）

    HTML表格用于在網(wǎng)頁上展示數(shù)據(jù),通過標(biāo)簽及其相關(guān)標(biāo)簽來創(chuàng)建,表格由行和列組成,每一行包含一個或多個單元格,單元格可以包含文本、圖像、鏈接等元素,本文將詳細(xì)介紹HTML表格
    2025-03-12

  • 禁止HTML頁面滾動的操作方法

    本文介紹了三種禁止HTML頁面滾動的方法：通過CSS的overflow屬性、使用JavaScript的滾動事件監(jiān)聽器以及使用CSS的position:fixed屬性,每種方法都有其適用場景和優(yōu)缺點，感興
    2025-02-24

  • 使用HTML和CSS實現(xiàn)文字鏤空效果的代碼示例

    在 Web 開發(fā)中，文本的視覺效果是提升用戶體驗的重要因素之一,通過 CSS 技巧，我們可以創(chuàng)造出許多獨特的效果，例如文字鏤空效果,本文將帶你一步一步實現(xiàn)一個簡單的文字鏤空
    2024-11-17

  • Html去除a標(biāo)簽的默認(rèn)樣式的操作代碼

    在Html中,a標(biāo)簽?zāi)J(rèn)的超鏈接樣式是藍(lán)色字體配下劃線,這可能不滿足所有設(shè)計需求,如需去除這些默認(rèn)樣式,可以通過CSS來實現(xiàn),本文給大家介紹Html去除a標(biāo)簽的默認(rèn)樣式的操作代碼
    2024-09-25

  • HTML文本域如何設(shè)置為禁止用戶手動拖動

    在HTML中,可以通過設(shè)置CSS的resize屬性為none,來禁止用戶手動拖動文本域（textarea）的大小,這種方法簡單有效,適用于大多數(shù)現(xiàn)代瀏覽器,但需要在老舊瀏覽器中進(jìn)行測試以確保
    2024-09-25

  • 如何通過HTML/CSS 實現(xiàn)各類進(jìn)度條的功能

    本文詳細(xì)介紹了如何利用HTML和CSS實現(xiàn)多種風(fēng)格的進(jìn)度條,包括基礎(chǔ)的水平進(jìn)度條、環(huán)形進(jìn)度條以及球形進(jìn)度條等,還探討了如何通過動畫增強(qiáng)視覺效果,內(nèi)容涵蓋了使用HTML原生標(biāo)簽
    2024-09-19

  • HTML中Canvas關(guān)鍵知識點總結(jié)

    Canvas 提供了一套強(qiáng)大的 2D 繪圖 API，適用于各種圖形繪制、圖像處理和動畫制作,可以幫助你創(chuàng)建復(fù)雜且高效的網(wǎng)頁圖形應(yīng)用，這篇文章主要介紹了HTML中Canvas關(guān)鍵知識點總結(jié)
    2024-06-03

  • html table+css實現(xiàn)可編輯表格的示例代碼

    本文主要介紹了html table+css實現(xiàn)可編輯表格的示例代碼，主要使用HTML5的contenteditable屬性，文中通過示例代碼介紹的非常詳細(xì)，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)
    2024-03-06

  • HTML中使用Flex布局實現(xiàn)雙行夾批效果

    本文主要介紹了HTML中使用Flex布局實現(xiàn)雙行夾批效果，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)
    2024-02-22

  • HTML+CSS實現(xiàn)炫酷登錄切換的項目實踐

    在網(wǎng)站開發(fā)中，登錄頁面是必不可少的一部分，本文就來介紹一下HTML+CSS實現(xiàn)登錄切換，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需
    2024-02-02

最新評論