在之前的文章中，我們介紹了無序列表和有序列表的使用方法。但是這兩種列表只能按照順序列出項目，并沒有提供對每個項目進行描述的功能。而定義列表則可以在每個項目后面添加具體的描述，讓列表更加豐富有用。 新

在之前的文章中，我們介紹了無序列表和有序列表的使用方法。但是這兩種列表只能按照順序列出項目，并沒有提供對每個項目進行描述的功能。而定義列表則可以在每個項目后面添加具體的描述，讓列表更加豐富有用。

新建HTML文件

首先，我們需要新建一個HTML文件。將記事本的名字改為“html定義列表的使用（20）.html”，并將文件保存為HTML格式，以便瀏覽器可以正確打開。

打開文件

右擊HTML文件圖標，在彈出的下拉菜單中選擇“打開方式（H）”，然后選擇“Sublime Text”或者其他文本編輯器打開。

編寫HTML代碼

在文件中編寫以下HTML代碼：

lt;!DOCTYPE htmlgt;
lt;htmlgt;
lt;headgt;
  lt;titlegt;html定義列表的使用（20）lt;/titlegt;
  lt;meta charset"UTF-8"gt;
lt;/headgt;
lt;bodygt;
  lt;dlgt;
    lt;dtgt;鄧稼先lt;/dtgt;
    lt;ddgt;偉大的科學(xué)家lt;/ddgt;
    lt;dtgt;牛頓lt;/dtgt;
    lt;ddgt;偉大的物理學(xué)家lt;/ddgt;
    lt;dtgt;huilt;/dtgt;
    lt;ddgt;創(chuàng)造無限可能和more best peoplelt;/ddgt;
  lt;/dlgt;
lt;/bodygt;
lt;/htmlgt;

保存并查看

保存文件后，右擊HTML文件圖標，選擇“在瀏覽器中打開”選項。您將看到定義列表的內(nèi)容在上方顯示，而描述內(nèi)容則會縮進2個字符，以與定義內(nèi)容相區(qū)分。

源代碼參考

以下是本案例的完整源代碼：

lt;!DOCTYPE htmlgt;
lt;htmlgt;
lt;!-- 用lt;!DOCTYPE htmlgt;來聲明這是一個HTML5文檔 --gt;
lt;htmlgt;
lt;!-- 用lt;htmlgt;標簽來包含網(wǎng)頁的主體 --gt;
lt;headgt;
lt;!-- 用lt;headgt;標簽包含HTML文檔的頭部部分 --gt;
lt;titlegt;html定義列表的使用（20）lt;/titlegt;
lt;!-- 用lt;titlegt;標簽來寫入網(wǎng)頁的標題 --gt;
lt;meta charset"utf-8"gt;
lt;!-- 用lt;metagt;標簽來設(shè)置文檔的編碼格式，以便瀏覽器能夠正確解讀網(wǎng)頁 --gt;
lt;style type"text/css"gt;
lt;/stylegt;
lt;!-- 用lt;stylegt;標簽來包含網(wǎng)頁中設(shè)置的樣式，并聲明其為CSS類型 --gt;
lt;/headgt;
lt;!-- 用lt;bodygt;標簽包含HTML文檔的主體部分 --gt;
lt;bodygt;
lt;!-- lt;dlgt;標簽用來定義列表，lt;dtgt;標簽用來定義內(nèi)容，lt;ddgt;標簽用來寫入描述的內(nèi)容 --gt;
lt;!-- 例子1 --gt;
lt;dlgt;
lt;dtgt;鄧稼先lt;/dtgt;
lt;ddgt;偉大的科學(xué)家lt;/ddgt;
lt;/dlgt;
lt;!-- 例子2 --gt;
lt;dlgt;
lt;!-- lt;dtgt;標簽寫入定義的內(nèi)容 --gt;
lt;dtgt;牛頓lt;/dtgt;
lt;!-- lt;ddgt;標簽寫入上面定義內(nèi)容的描述 --gt;
lt;ddgt;偉大的物理學(xué)家lt;/ddgt;
lt;dtgt;愛迪生lt;/dtgt;
lt;ddgt;偉大的發(fā)明學(xué)家lt;/ddgt;
lt;/dlgt;
lt;!-- 例子3 --gt;
lt;dlgt;
lt;dtgt;huilt;/dtgt;
lt;ddgt;創(chuàng)造無限可能和more best peoplelt;/ddgt;
lt;/dlgt;
lt;/bodygt;
lt;/htmlgt;