Untuk mengelompokkan berbilang istilah dan huraian, letakkan satu atau lebih elemen dt sebelum satu atau lebih elemen dd di dalam dl. Panduan ini menunjukkan cara memilih pengelompokan yang sesuai, mencipta glosari kecil dalam TextEdit pada Mac, dan memastikan hubung kaitnya kekal jelas.

Bagaimanakah senarai huraian HTML mengelompokkan istilah?

Senarai huraian mewakili perkaitan antara nama dengan nilai. Setiap kumpulan mengandungi sekurang-kurangnya satu istilah dan satu huraian, dengan semua istilah muncul sebelum huraian. Istilah seterusnya selepas sesuatu huraian memulakan kumpulan baharu. Perkaitan ini ditentukan oleh susunan dokumen. Piawaian HTML: Elemen dl

Bagi glosari, istilah mungkin berupa perkataan berkaitan susun atur dan huraiannya mungkin menerangkan perkataan itu. Beberapa istilah berturutan boleh berkongsi satu huraian. Anda tidak perlu mengulang penjelasan yang sama selepas setiap nama alternatif. MDN: Elemen istilah huraian

Soalan praktikalnya ialah perkara yang patut dikelompokkan bersama. Sebelum menulis penanda, catat setiap perkaitan yang dimaksudkan dalam bahasa biasa. Dalam contoh rekaan ini, “Gap” dan “Gutter” berkongsi satu penjelasan, manakala “Tile” mempunyai dua makna alternatif.

Perkaitan yang dimaksudkan Struktur dalam satu kumpulan
Satu istilah dengan satu huraian Satu dt, kemudian satu dd
Beberapa istilah berkongsi satu huraian Semua elemen dt, kemudian satu dd
Satu istilah dengan huraian alternatif Satu dt, kemudian beberapa dd
Beberapa istilah berkongsi huraian alternatif Semua elemen dt, kemudian semua elemen dd
Satu huraian yang mengandungi beberapa perenggan Satu dd yang mengandungi perenggan tersebut

Corak ini mengikut peraturan pengelompokan piawaian. Khususnya, huraian berasingan mewakili nilai alternatif; perenggan yang tergolong dalam satu nilai kekal di dalam dd yang sama. Piawaian HTML: Semantik senarai huraian

Huraian manakah yang patut berkongsi kumpulan?

Gunakan ujian keputusan ini: bolehkah setiap huraian dalam kumpulan yang dicadangkan itu digunakan secara munasabah untuk setiap istilah dalam kumpulan tersebut? Jika tidak, bahagikan kandungan kepada kumpulan berasingan. Ini ialah semakan editorial yang berasaskan model perkaitan dan membantu mengesan padanan yang tidak disengajakan sebelum kandungan dipaparkan pada halaman.

Beberapa istilah dengan satu huraian yang dikongsi

Petikan ini memberikan dua istilah glosari rekaan satu penjelasan bersama. Kedua-dua istilah muncul sebelum huraian, selaras dengan corak berbilang istilah yang didokumenkan oleh MDN. MDN: Beberapa istilah, satu huraian

<dl>
  <dt>Gap</dt>
  <dt>Gutter</dt>
  <dd>The space between adjacent columns.</dd>
</dl>

Jangan anggap ini sebagai dua entri berasingan yang kebetulan tiada huraian. Contoh ini sengaja menganggap kedua-dua nama itu sebagai satu kumpulan. Jika glosari anda memberikan makna yang berbeza kepada kedua-duanya, berikan huraian tersendiri kepada setiap nama.

Satu istilah dengan huraian alternatif

Satu huraian boleh menyusuli huraian yang lain dalam kumpulan yang sama. Di sini, glosari rekaan itu menggunakan “Tile” untuk dua konsep yang berbeza. MDN: Elemen butiran huraian

<dl>
  <dt>Tile</dt>
  <dd>A repeating unit in a visual pattern.</dd>
  <dd>A rectangular content block in a page layout.</dd>
</dl>

Jika beberapa nama berkongsi alternatif yang sama, letakkan istilah tambahan sebelum huraian pertama. Jangan anggap bahawa istilah pertama hanya berpasangan dengan huraian pertama dan istilah kedua hanya dengan huraian kedua; hal itu memerlukan kumpulan berasingan. MDN secara jelas mendokumenkan gabungan berbilang istilah dan huraian. MDN: Beberapa istilah dan huraian

Satu huraian dengan beberapa perenggan

Jika perenggan kedua mengembangkan penjelasan pertama, kekalkan kedua-duanya di dalam satu dd. dd menerima kandungan aliran, termasuk perenggan. Ini mengekalkan satu huraian sambil membolehkan struktur dalaman yang mudah dibaca. MDN: Ringkasan teknikal butiran huraian

<dl>
  <dt>Canvas</dt>
  <dd>
    <p>The working area for a composition.</p>
    <p>In this glossary, the term refers to the whole area.</p>
  </dd>
</dl>

Cipta contoh lengkap dalam TextEdit pada Mac anda

Mulakan dengan fail baharu supaya anda boleh menyemak hasilnya tanpa mengubah dokumen sedia ada. Dalam TextEdit, pilih File > New, kemudian Format > Make Plain Text. Apple mendokumentasikan langkah ini sebagai permulaan untuk menulis fail HTML. Apple: Bekerja dengan dokumen HTML dalam TextEdit pada Mac

Tampalkan dokumen lengkap di bawah. Dokumen ini menggabungkan tiga keputusan di atas menjadi satu glosari kecil. Setiap kumpulan mempunyai pembalut div tersendiri, iaitu struktur yang disokong untuk menggunakan gaya atau atribut pada seluruh kumpulan. MDN: Membalut kumpulan nama-nilai

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Layout glossary</title>
</head>
<body>
  <h1>Layout glossary</h1>
  <dl>
    <div>
      <dt>Gap</dt>
      <dt>Gutter</dt>
      <dd>The space between adjacent columns.</dd>
    </div>
    <div>
      <dt>Tile</dt>
      <dd>A repeating unit in a visual pattern.</dd>
      <dd>A rectangular content block in a page layout.</dd>
    </div>
    <div>
      <dt>Canvas</dt>
      <dd>
        <p>The working area for a composition.</p>
        <p>In this glossary, the term refers to the whole area.</p>
      </dd>
    </div>
  </dl>
</body>
</html>

Pilih File > Save, namakan fail itu layout-glossary.html, kemudian klik Save. Jika TextEdit bertanya sambungan fail yang hendak digunakan, pilih Use .html. Ini ialah langkah penyimpanan yang didokumenkan oleh Apple untuk fail HTML yang ditulis secara manual. Apple: Cipta fail HTML

Buka fail yang disimpan dalam pelayar anda. Bandingkan teks yang dipaparkan dengan tiga perkaitan yang dijangka: “Gap” dan “Gutter” berkongsi satu penjelasan; “Tile” mempunyai dua huraian; “Canvas” mempunyai satu huraian yang mengandungi dua perenggan. Gunakan perbandingan ini untuk menyemak perkaitan kandungan yang dimaksudkan, walaupun jarak lalai pelayar kelihatan berbeza daripada reka bentuk pilihan anda.

Kekalkan pengelompokan semasa menyunting

HTML menyokong sama ada kumpulan istilah-huraian secara langsung di dalam dl, atau kumpulan yang dibalut dalam elemen div. Gunakan satu struktur yang konsisten dalam senarai tertentu. Dalam versi yang dibalut di atas, kekalkan istilah dan huraian setiap kumpulan secara langsung di dalam pembalutnya; jangan balut istilah dan huraian dalam bekas yang berasingan. Piawaian HTML: Model kandungan senarai huraian

Apabila anda menyemak semula contoh itu, gunakan semakan ringkas ini:

  1. Cari kumpulan yang ingin anda ubah.
  2. Kekalkan set lengkap istilahnya sebelum huraian.
  3. Tentukan sama ada teks penerangan baharu ialah nilai lain atau perenggan lain bagi nilai semasa.
  4. Tambahkan kumpulan lengkap yang baharu apabila memperkenalkan istilah yang tidak berkaitan.
  5. Simpan dokumen dan muat semula pratonton pelayar.

Contohnya, menambahkan “Panel” di antara dua huraian “Tile” akan mengganggu perkaitan yang dimaksudkan: huraian selepasnya akan tergolong dalam kumpulan baharu yang bermula di situ. Letakkan istilah baharu dan huraiannya dalam pembalut tersendiri. Ini selaras dengan peraturan piawaian bahawa istilah yang muncul selepas sesuatu huraian memulakan kumpulan baharu. Piawaian HTML: Algoritma pengelompokan

Jika TextEdit membuka semula fail itu sebagai teks berformat, gunakan File > Open, pilih dokumen, klik Show Options, kemudian pilih Ignore rich text commands sebelum membukanya. Untuk fail akan datang, pilih Display HTML files as HTML code instead of formatted text di bawah TextEdit > Settings > Open and Save. Apple: Lihat dokumen HTML sebagai kod

Tumpukan semakan akhir pada makna: kenal pasti istilah, kenal pasti huraian yang dikongsi, dan pastikan pemisah perenggan tidak secara tidak sengaja menjadi nilai berasingan. Setelah perkaitan itu betul, glosari tersebut sedia untuk sebarang gaya persembahan yang diperlukan oleh dokumen anda.

Sumber