Danh sách mô tả

Danh sách mô tả (Descriptive List) là một dạng đặc biệt của danh sách:

danh sách
- danh sách
  - danh sách...

Mục đích

Sau bài học này bạn có thể:

Xây dựng danh sách các mục cùng với khối văn bản mô tả nó được thụt vào trong.
Tạo một danh mục sách bằng danh sách mô tả.

Bài học

Lưu ý: Nếu bạn không có tài liệu từ những bài học trước, bạn có thể download ngay bây giờ. Trong bài 6 chúng ta đã biết cách để tạo hai loại danh sách: có thứ tự <ol>...</ol> và không có thứ tự <ul>...</ul>. Bây giờ, chúng tôi sẽ giới thiệu một dạng thứ ba, danh sách mô tả. Không giống như những loại danh sách chúng ta đã thấy trước đây, danh sách mô tả đánh dấu các mục của nó không phải là một dấu chấm hoặc một số mà bằng dạng trình bày thụt vào trong của nó.
Dạng của tag danh sách mô tả là :


<dl>
<dt> description title1
<dd> description description1
<dt> description title2
<dd> description description2
                :
                :
                :
<dt> description titleN
<dd> description descriptionN
</dl>

Tag <dl> .... </dl> chứa trong nó nhiều cặp tiêu đề mô tả (description title) <dt> và sự mô tả (description) <dd> Một Web browser sẽ tạo thành một danh sách với mỗi mô tả được trình bày thụt vào so với tiêu đề của nó.
Khi nhìn trong Web browser ví dụ trên sẽ trông giống như sau:

description title1

description description1

description title2

description description2

:

:

description titleN

description descriptionN

Một danh sách mô tả có thể được sử dụng như là một tự điển (glossary) các định nghĩa, nhưng trong ví dụ chúng ta, chúng ta sẽ dùng nó để tạo một thư mục sách ngắn cho bài Volcano Web:

Mở tập tin HTML index.htm trong trình soạn thảo.

Sau danh sách không có thứ tự của tiêu đề References nhập như sau :


<h3>Bibliography</h3>
Check your library for these books:
<dl>
<dt>Cas, R.A.F. and Wright, J. V. (1987). 
<dd><I>Volcanic Successions: Modern and Ancient.</I> 
London: Allen &amp; Unwin.

<dt>La Croix, A. (1904)
<dd><I>La Montagna Pel&eacute;e et ses &Eacute;ruptions.</I>
Paris: Masson

<dt>Lipman, P.W. and Mullineaux (eds). (1981)
<dd><I>The 1980 Eruptions of Mount St. Helens, Washington.
</I>U.S. Geological Survey Professional Paper 1250.
</dl>

Chú ý: Chúng ta đã sử dụng một số Ký tự Đặc biệt cho dấu và ("&") trong tham khảo đầu tiên và dấu nhấn cho tham khảo thứ hai. Nếu bạn chưa quen với các ký tự đặc biệt của HTML, xem lại bài 10

Lưu trữ và Reload trong Web browser của bạn.

Kiểm tra lại công việc của bạn

So sánh tài liệu của bạn với ví dụ mẫu để biết tài liệu nên xuất hiện như thế nào. Nếu tài liệu của bạn không giống như ví dụ mẫu, hãy kiểm tra lại văn bản bạn đã đánh trong trình soạn thảo. Đừng quên các tag <dl>... </dl> để đánh dấu toàn danh sách. Lỗi thường gặp là quên chuyển đổi các tag <dt> và <dd>

Xem lại

Xem lại những chủ đề sau:

Danh sách mô tả khác với danh sách có thứ tự và danh sách không có thứ tự ở những điểm nào?
Trong trường hợp nào bạn có thể phải sử dụng trong một danh sách mô tả?
Sự khác nhau giữa tag <dt> và tag <dd>?

Thực tập tự do

Sử dụng danh sách mô tả để thêm một bảng thuật ngữ hay một danh mục sách trong trang HTML của riêng bạn.

Một số thông tin thêm

Bạn có thể thêm các danh sách có thứ tự và không có thứ tự vào bên trong một danh sách mô tả. Lấy ví dụ, chúng ta sẽ tạo một một danh sách các nhóm khoáng chất chính. Mỗi nhóm có sự mô tả các tính chất của chúng, cùng với một danh sách con các khoáng chất và chúng được sử dụng trong xã hội như thế nào. Chúng ta muốn nó có dạng như sau (chỉ trình bày một ít):

Oxides

Combinations of metal ions with Oxygen, comprises the major ores extracted in mining operations

Hematite (iron ore)
Magnetite (iron ore, magnetic mineral)
Corundum (gemstone, abrasive)

Sulfates

Metal ions combine with the Sulfate ion (SO4), atomic structure sometimes can allow bonding of water molecules

Gypsum (plaster)
Barite (drilling mud)

Dạng HTML cho kết quả trên có dạng:


<dl>
<dt><b>Oxides</b>
<dd>Combinations of metal ions with Oxygen, comprises the major
ores extracted in mining operations
    <ul>
    <li>Hematite (iron ore)
    <li>Magnetite (iron ore, magnetic mineral)
    <li>Corundum (gemstone, abrasive)
    </ul>
<dt><b>Sulfates</b>
<dd>Metal ions combines with the Sulfate ion (SO4), atomic
structure sometimes can allow bonding of water molecules
    <ul>
    <li>Gypsum (plaster)
    <li>Barite (drilling mud)
    </ul>
</dl>

Đi đến phần tiếp theo....

Thêm một thông tin về "chữ ký" (signature) cùng với một liên kết để gởi e-mail.

Huỳnh Phúc Huy 's Blog

Saturday, September 28, 2013

HTML cơ bản - Phần 18