V bahasa HTML satu set tag khusus disediakan untuk menyajikan informasi dalam bentuk daftar. Daftar adalah salah satu bentuk penyajian data yang paling umum digunakan seperti pada dokumen elektronik dan di cetak. Kami bertemu dengan daftar hampir setiap hari - itu bisa berupa daftar pembelian yang diperlukan di toko, siswa di kelas, atau hanya hal-hal yang perlu dilakukan. Kemampuan untuk mengatur struktur daftar tersedia di banyak editor teks khususnya pengolah kata yang kuat Microsoft Word memiliki alat yang nyaman untuk memformat daftar dari berbagai jenis (kemampuan untuk membuat daftar HTML ketika Bantuan Microsoft Kata dibahas di Bab 8.) Berikut adalah sejumlah kasus di mana penggunaan daftar cukup nyaman:
- Menggabungkan potongan-potongan informasi ke dalam satu struktur untuk memberikan tampilan yang mudah dibaca.
- Deskripsi proses langkah-demi-langkah yang kompleks.
- Lokasi informasi dalam gaya daftar isi, paragraf yang menunjukkan bagian dokumen yang sesuai.
Perhatikan bahwa item di atas hanya diatur dalam bentuk struktur daftar.
HTML menyediakan tipe dasar daftar berikut: bullet, numbered, dan list of definition. Tag berikut digunakan untuk mengimplementasikan daftar dari berbagai jenis:
- ,
- (LI - Item Daftar). Menandai
- tidak memerlukan tag akhir yang sesuai, meskipun keberadaannya pada prinsipnya tidak dilarang. Browser biasanya memulai setiap item daftar baru pada baris baru saat menampilkan dokumen.
Informasi yang diberikan cukup untuk membuat daftar bullet dasar. Berikut adalah contoh dokumen HTML yang menggunakan daftar berpoin, yang ditampilkan di browser seperti yang ditunjukkan pada Gambar. 2.1.
Contoh daftar peluru - Aries
- Taurus
- saudara kembar
- Kanker
- singa
- Virgo
- timbangan
- Kalajengking
- Sagittarius
- Capricornus
- Aquarius
- ikan
Lambang Zodiak:
Beras. 2.1. Tampilan Peramban Daftar Bulat
Perhatikan bahwa selain item daftar yang ditandai dengan tag
- , elemen HTML lain mungkin ada. Dalam contoh di atas, salah satu elemen ini adalah teks biasa, yang bukan merupakan item daftar, tetapi berperan sebagai judulnya.
Catatan
Beberapa buku teks HTML menginstruksikan Anda untuk menggunakan wadah tag untuk mengatur judul daftar.
(LH - Tajuk Daftar, tajuk daftar). Tag ini saat ini tidak dikenali oleh browser utama mana pun dan bukan bagian dari spesifikasi HTML. Dengan demikian, penerapannya menjadi tidak berarti, meskipun tidak akan menimbulkan kesalahan. di tag
- dua parameter dapat ditentukan: COMPACT dan TYPE.
- .
Contoh rekaman:
-
.
Catatan
Browser menafsirkan menentukan jenis penanda secara berbeda untuk elemen individu Daftar. Browser Netscape mengubah tipe penanda untuk ini dan semua penanda berikutnya hingga menemukan penggantian tipe penanda lainnya. peramban Internet Explorer mengubah tampilan penanda hanya untuk dari elemen ini.
Penanda daftar grafis
Grafik dapat digunakan sebagai penanda daftar, yang banyak digunakan untuk membuat dokumen HTML yang menarik dan dirancang dengan indah. Faktanya, kemungkinan seperti itu tidak disediakan secara langsung oleh bahasa HTML, tetapi diimplementasikan secara artifisial. Ini tidak berarti bahwa tidak disarankan atau tercela untuk melakukan ini, tetapi hanya berarti bahwa tidak ada konstruksi bahasa HTML khusus yang akan digunakan di sini.
Untuk memahami idenya, Anda perlu memahami bagaimana daftar diterapkan di halaman HTML. Ternyata daftar tag
- (serta tag dari jenis daftar lainnya, yang dipertimbangkan di bawah) melakukan satu-satunya tugas - ini memberi tahu browser bahwa semua informasi yang terletak setelah tag ini harus ditampilkan dengan menggeser ke kanan (menjorok) dengan jumlah tertentu. Tag
- yang menunjuk ke item daftar individual memberikan penanda item daftar standar.
Jika kita perlu membuat daftar dengan penanda grafis, maka kita dapat melakukannya tanpa tag sama sekali.
- ... Cukup menyisipkan gambar grafik yang diinginkan di depan setiap elemen daftar. Satu-satunya masalah yang perlu dipecahkan dalam kasus ini adalah memisahkan elemen-elemen daftar satu sama lain. Anda dapat menggunakan tag paragraf untuk ini
Atau umpan saluran paksa
... Contoh implementasi daftar dengan spidol grafis, yang tampilannya ditunjukkan pada Gambar. 2.2 ditunjukkan di bawah ini:Daftar berpoin Lambang Zodiak:
Aries
Beras. 2.2. Daftar peluru dengan spidol grafis
Dalam contoh yang diberikan, file grafik Green_ball.gif digunakan sebagai penanda item daftar. Perhatikan bahwa penggunaan grafik pada halaman HTML dapat secara signifikan meningkatkan jumlah informasi yang ditransfer. Namun, dalam pada kasus ini peningkatan ini sangat tidak signifikan. Di sini, file yang sama digunakan untuk semua penanda,
yang akan ditransmisikan hanya sekali. Ukuran file yang berisi gambar kecil juga sangat kecil.
Catatan
Metode untuk membuat daftar dengan spidol grafis dibahas secara bergantian di Bab 8.
Daftar bernomor
Jenis daftar lain yang diimplementasikan dalam HTML adalah daftar bernomor. Jika tidak, daftar jenis ini disebut terurut. Nama terakhir sering digunakan sebagai terjemahan formal dari nama tag yang sesuai.
- , dengan bantuan daftar jenis ini yang diatur dalam dokumen HTML (OL - Ordered List).
- .
Berikut adalah contoh dokumen HTML menggunakan daftar bernomor, yang tampilannya browser ditunjukkan pada Gambar. 2.3.
Contoh daftar bernomor - Sirius
- Untuk anopus
- Arcturus
- Alpha Centauri
- vega
- K apella
- Rigel
- Procyon
- Achernar
- Beta Centauri
- Vetelgeuse
- Aldebaran
. . .- Mizar
. . .- kutub
Bintang paling terang yang terlihat dari Bumi:
Beras. 2.Z. Daftar bernomor
di tag
- parameter berikut dapat ditentukan: COMPACT, TYPE dan START.
- .
Contoh rekaman:
- .
Tag MULAI parameter
- memungkinkan Anda untuk memulai penomoran daftar dengan non-satu. Bilangan asli harus selalu ditentukan sebagai nilai parameter START, terlepas dari jenis penomoran daftar. Mari kita beri contoh:
- untuk daftar bernomor, memungkinkan parameter TYPE dan VALUE digunakan. Parameter TYPE dapat mengambil nilai yang sama seperti untuk tag.
- .
- .
Catatan
Browser menafsirkan menentukan jenis penomoran untuk item daftar individu secara berbeda. Browser Netscape mengubah penomoran untuk elemen ini dan semua elemen berikutnya hingga menemukan penggantian lainnya. Internet Explorer mengubah tampilan nomor untuk item ini saja.
Znilai parameter VALUE tag
- - memungkinkan Anda untuk mengubah nomor item daftar ini. Ini juga mengubah penomoran semua elemen berikutnya. Aplikasi tipikal adalah daftar dengan penghilangan elemen tertentu. Contoh daftar tersebut diberikan di atas (Gbr. 2.3). Ini memberikan daftar bintang paling terang, di mana di 58 dan 75 tempat adalah bintang yang terlihat jelas di garis lintang kita (Mizar adalah bintang paling terang di konstelasi Ursa Major, dan Bintang Kutub adalah Ursa Minor).
Berikut adalah contoh asli lain dari penggunaan berbagai jenis penomoran. Kode HTML berikut berisi tiga daftar dengan penomoran yang berbeda. Untuk kemudahan melihat, setiap daftar ditempatkan di sel tabel yang terpisah. Ketiga daftar identik dan hanya berbeda dalam jenis penomoran: di kolom pertama tabel - angka Arab, di kedua - Romawi, dan di ketiga, penomoran dalam huruf Latin. Perhatikan bahwa item daftar kosong, yaitu setelah tag apa pun
- Tidak ada data yang tersedia. Contoh semacam ini dapat digunakan sebagai tabel korespondensi antara pencatatan angka dalam angka Arab dan Romawi. Ternyata browser apa pun yang mendukung daftar dapat digunakan sebagai generator untuk tabel seperti itu (Gambar 2.4), selama Anda mengetikkan kode HTML yang disediakan. Angka Romawi bekerja dengan benar hingga 3999. Dengan memeriksa kolom kanan, Anda dapat memahami bagaimana angka Romawi diberi nomor. Ketika penomoran satu huruf (dari A hingga Z) habis, nomor dua huruf pertama diambil sebagai nomor berikutnya - AA, dll.
Penggunaan <a href="https://obanracer.ru/id/operatory-vetvleniya-v-komande-select-preobrazovaniya-nvl-dlya-razlichnyh-tipov.html">dari berbagai jenis</a> penomoran dalam daftar -
. . .
-
. . .
-
. . .
Beras. 2.4. Berbagai jenis penomoran daftar HTML
daftar definisi
Daftar definisi, juga disebut kosa kata definisi istilah khusus, adalah jenis daftar khusus. Tidak seperti jenis daftar lainnya, setiap item dalam daftar definisi selalu memiliki dua bagian. Di bagian pertama item daftar, istilah yang didefinisikan ditulis, dan di bagian kedua, teks dalam bentuk entri kamus, mengungkapkan arti istilah tersebut.
Daftar definisi ditentukan menggunakan tag penampung
- (Daftar Definisi). Di dalam wadah dengan tag
- (Definition Term) menandai istilah yang sedang didefinisikan, dan tag
- (Deskripsi Definisi) - paragraf dengan definisinya. Untuk tag
- dan
- Anda tidak perlu menulis tag akhir yang sesuai.
Secara umum, daftar definisi ditulis sebagai berikut:
- Ketentuan
- Definisi istilah
Dalam teks setelah tag
- elemen level blok seperti tag paragraf tidak dapat digunakan
Atau header
-
... Biasanya, teks istilah yang didefinisikan harus dalam satu baris. Teks yang berisi definisi istilah ditampilkan dimulai dengan baris berikutnya(atau melintasi garis untuk beberapa browser) setelah definisi istilah, menjorok ke kanan. Dalam informasi yang ditempatkan setelah tag
- , elemen level blok dapat ditemukan. Ini menyiratkan, khususnya, bahwa daftar definisi dapat disarangkan.
di tag
- parameter COMPACT dapat ditentukan, yang tujuannya mirip dengan daftar lain yang dijelaskan di atas.
- orang yang plegmatis
- Pasif, sangat mampu, lambat beradaptasi;
suasana hati yang stabil, sedikit menerima pengaruh eksternal;
kelesuan reaksi emosional dan kelambatan dalam aktivitas kehendak
- Optimis
- Aktif, energik, mudah beradaptasi, -
keaktifan dan mobilitas reaksi emosional, kecepatan dan kekuatan manifestasi kehendak
- Mudah tersinggung
- Aktif, sangat energik, gigih;
ketidaksabaran dan kekuatan reaksi emosional, manifestasi kehendak kekerasan
- Melankolik
- Pasif, mudah lelah, sulit beradaptasi, -
kelemahan kemauan dan dominasi suasana hati yang tertekan, keraguan diri - Zempia
- bulan
- peta
- phobos
- Deimos
- Uranus
- Ariel
- payung
- Titania
- oberon
- Miranda
- Neptunus
- Triton
- Dewi laut
Jenis daftar lain yang diimplementasikan dalam HTML adalah daftar bernomor. Jika tidak, daftar HTML jenis ini disebut terurut. Nama terakhir sering digunakan sebagai terjemahan formal dari nama tag yang sesuai.
- , dengan bantuan daftar jenis ini yang diatur dalam dokumen HTML (OL - Ordered List).
- .
Berikut adalah contoh dokumen HTML menggunakan daftar bernomor, yang tampilannya browser ditunjukkan pada Gambar. 2.3.
Contoh daftar bernomor Bintang paling terang yang terlihat dari Bumi:
- Sirius
- ke anopus
- Arcturus
- Alpha Centauri
- vega
- K apella
- Rigel
- Procyon
- Achernar
- Beta Centauri
- Vetelgeuse
- Aldebaran
- Mizar
- kutub
Beras. 2.Z. Daftar bernomor
di tag
- parameter berikut dapat ditentukan: COMPACT, TYPE dan START.
- .
Contoh rekaman:
- .
Tag MULAI parameter
- memungkinkan Anda untuk memulai penomoran daftar dengan non-satu. Bilangan asli harus selalu ditentukan sebagai nilai parameter START, terlepas dari jenis penomoran daftar. Mari kita beri contoh:
- untuk daftar bernomor, memungkinkan parameter TYPE dan VALUE digunakan. Parameter TYPE dapat mengambil nilai yang sama seperti untuk tag.
- .
- .
Catatan
Browser menafsirkan menentukan jenis penomoran untuk item daftar individu secara berbeda. Browser Netscape mengubah penomoran untuk elemen ini dan semua elemen berikutnya hingga menemukan penggantian lainnya. Internet Explorer mengubah tampilan nomor untuk item ini saja.
Nilai parameter tag VALUE
- - memungkinkan Anda untuk mengubah nomor item daftar ini. Ini juga mengubah penomoran semua elemen berikutnya. Aplikasi tipikal adalah daftar dengan penghilangan elemen tertentu. Contoh daftar tersebut diberikan di atas (Gbr. 2.3). Ini memberikan daftar bintang paling terang, di mana di 58 dan 75 tempat adalah bintang yang terlihat jelas di garis lintang kita (Mizar adalah bintang paling terang di konstelasi Ursa Major, dan Bintang Kutub adalah Ursa Minor).
Berikut adalah contoh asli lain dari penggunaan berbagai jenis penomoran. Kode HTML berikut berisi tiga daftar dengan penomoran yang berbeda. Untuk kemudahan melihat, setiap daftar ditempatkan di sel tabel yang terpisah. Ketiga daftar identik dan hanya berbeda dalam jenis penomoran: di kolom pertama tabel - angka Arab, di kedua - Romawi, dan di ketiga, penomoran dalam huruf Latin. Perhatikan bahwa item daftar kosong, yaitu setelah tag apa pun
- Tidak ada data yang tersedia. Contoh semacam ini dapat digunakan sebagai tabel korespondensi antara pencatatan angka dalam angka Arab dan Romawi. Ternyata browser apa pun yang mendukung daftar dapat digunakan sebagai generator untuk tabel seperti itu (Gambar 2.4), selama Anda mengetikkan kode HTML yang disediakan. Angka Romawi bekerja dengan benar hingga 3999. Dengan memeriksa kolom kanan, Anda dapat memahami bagaimana angka Romawi diberi nomor. Ketika penomoran satu huruf (dari A hingga Z) habis, nomor dua huruf pertama diambil sebagai nomor berikutnya - AA, dll.
Menggunakan berbagai jenis penomoran dalam daftar
. . .
Beras. 2.4. Berbagai jenis penomoran daftar HTML
HTML mendukung daftar tiga jenis yang berbeda, yang masing-masing memiliki tema sendiri:
Daftar bernomor
Dalam daftar bernomor, browser secara otomatis memasukkan nomor item secara berurutan, mulai dari beberapa nilai (biasanya 1). Ini memungkinkan Anda untuk menyisipkan dan menghapus item dalam daftar tanpa melanggar penomoran, karena nomor lainnya akan dihitung ulang secara otomatis.
Daftar bernomor dibuat menggunakan elemen blok
Menandai- barang 1
- item 2
- butir 3
Elemen daftar bernomor harus berisi beberapa elemen daftar, seperti yang ditunjukkan pada contoh berikut:
Contoh: Daftar Bernomor
- Cobalah sendiri "
- Dapatkan kuncinya
- Masukkan kunci ke dalam kunci
- Putar kunci dua putaran
- Keluarkan kunci dari gemboknya
- Buka pintunya
Petunjuk langkah demi langkah
- Dapatkan kuncinya
- Masukkan kunci ke dalam kunci
- Putar kunci dua putaran
- Keluarkan kunci dari gemboknya
- Buka pintunya
Terkadang, ketika melihat kode HTML yang ada, Anda akan menemukan argumen Tipe dalam elemen
- A - huruf besar Latin (A, B, C...);
- a - huruf kecil Latin (a, b, c...);
- I - angka Romawi besar (I, II, III...);
- i - angka Romawi kecil (i, ii, iii...);
- 1 - Angka Arab (1, 2, 3...) (Digunakan secara default).
- dengan cara berikut:
-
Dalam hal ini, penomoran berurutan dari daftar akan terputus dan penomoran akan dimulai dari titik ini, dalam hal ini dari tujuh.
Contoh penggunaan atribut nilai menandai
Dalam contoh ini, "Item Daftar Pertama" akan menjadi nomor 1, "Item Daftar Kedua" akan menjadi nomor 7, dan "Item Daftar Ketiga" akan menjadi nomor 8.
Memformat daftar bernomor dengan CSS
Untuk mengubah nomor daftar, gunakan properti tipe-gaya-daftar lembar gaya CSS:
- ... Browser membuat indentasi setiap item daftar dan secara otomatis menampilkan poin.
- Poin pertama
- Poin kedua
- Poin ketiga
- tidak perlu hanya menempatkan teks, diperbolehkan untuk menempatkan elemen apa pun dari konten streaming (tautan, paragraf, gambar, dll.)
- dimungkinkan untuk membuat daftar bersarang, atau daftar tingkat kedua. Untuk membuat daftar, jelaskan daftar baru di dalam elemen
- daftar yang sudah tersedia. Saat Anda menumpuk satu daftar berpoin di daftar lain, browser secara otomatis mengubah gaya poin untuk daftar tingkat kedua. Daftar apa pun dapat disarangkan di dalam daftar lain. Contoh berikut menunjukkan struktur daftar berpoin yang bersarang di dalam item bernomor kedua.
- Cobalah sendiri "
- Senin
- Kirim email
- Kunjungi editor
- Memilih tema
- Desain yang didekorasi
- Laporan akhir
- Melihat pesan malam
- Selasa
- Revisi jadwal
- Kirim gambar
- Rabu...
- Senin
- Kirim email
- Kunjungi editor
- Memilih tema
- Desain yang didekorasi
- Laporan akhir
- Melihat pesan malam
- Selasa
- Revisi jadwal
- Kirim gambar
- Rabu...
- Cobalah sendiri "
- Kopi
- Kopi
- Kopi
- Kopi
- Kopi
- susu
- Kopi
- susu
- Kopi
- susu
- Kopi
- susu
- Cobalah sendiri "
- Taurus
- Gemini
- Aries
- Taurus
- Gemini
- (dari Istilah Definisi Bahasa Inggris - kata yang ditentukan, istilah) dan
- (dari Deskripsi Definisi Bahasa Inggris - deskripsi istilah yang ditentukan).
- istilah pertama
- Deskripsi suku pertama
- Istilah kedua
- Deskripsi suku kedua
- Cobalah sendiri "
- World Wide Web
- - dari bahasa Inggris. World Wide Web (WWW) adalah sistem terdistribusi yang menyediakan akses ke dokumen terkait yang terletak di berbagai komputer yang terhubung ke Internet.
- Internet
- - satu set jaringan yang menggunakan protokol pertukaran tunggal untuk mentransfer informasi.
- Lokasi
- - satu set halaman web individual yang dihubungkan oleh tautan dan satu desain.
- seperti yang ditunjukkan di bawah ini.
- Poin pertama
- Poin kedua
- Poin ketiga
Jika Anda tidak menentukan atribut tambahan apa pun dan cukup tulis tag
- , maka defaultnya adalah daftar dengan angka Arab (1, 2, 3, ...), seperti yang ditunjukkan pada Contoh 11.3.
- penciptaan ketepatan waktu (Anda tidak akan pernah terlambat untuk apa pun);
- pemulihan dari ketepatan waktu (tidak pernah terburu-buru ke mana pun);
- mengubah persepsi waktu dan jam.
- Angka Arab (1, 2, 3, ...);
- huruf latin besar (A, B, C, ...);
- huruf latin kecil (a, b, c, ...);
- angka romawi huruf besar (I, II, III, ...);
- angka romawi huruf kecil (i, ii, iii, ...).
- Raja Magnum XLIV
- Raja Siegfried XVI
- Raja Sigismund XXI
- Raja Husbrandt I
- :
Daftar bernomor:
- Kopi
- teh
- susu
Catatan: tandai
- sebagai elemen anak hanya dapat berisi tag
- , yaitu, semua isi daftar bernomor harus ditempatkan di dalam elemen
- ... Menandai
- , pada gilirannya, tidak memiliki batasan pada konten, sehingga Anda dapat menempatkan paragraf, gambar, tautan, tabel, daftar lain, dll. di dalamnya.
Daftar berpoin
Daftar berpoin- ini tidak berurutan, yaitu daftar elemen yang tidak berurutan, urutannya tidak masalah. Semua poin-poin memiliki poin-poin yang sama, secara default mereka ditampilkan sebagai lingkaran hitam kecil.
Untuk membuat daftar berpoin dalam HTML, gunakan tag
- , di mana elemen dari daftar itu sendiri berada (seperti dalam kasus daftar bernomor, tag
- yang berisi semua konten daftar yang ditampilkan):
Daftar Berpoin:
- Kopi
- teh
- susu
Jenis penanda
Tampilan poin dari daftar bernomor dapat diubah menggunakan atribut type. Atribut ini mendukung lima jenis penanda:
Daftar berpoin tidak memiliki atribut tipe, jadi Anda tidak bisa menggunakan HTML untuk mengubah tampilan poin untuk daftar berpoin. Untuk mengubah jenis penanda, dalam hal ini, Anda dapat menggunakan properti CSS m list-style-type, yang dengannya, selain default, Anda dapat memilih dua jenis penanda lagi: lingkaran atau persegi.
Mengubah poin untuk daftar:
Judul halaman Daftar bernomor dengan atribut type = "a":
- Apel
- Pisang
- Jeruk lemon
Daftar bernomor dengan atribut type = "I":
- Apel
- Pisang
- Jeruk lemon
Jenis penanda daftar berpoin:
- Apel
- Pisang
- Jeruk lemon
- Apel
- Pisang
- Jeruk lemon
Properti CSS tipe-daftar, selain tipe poin untuk daftar berpoin, memiliki banyak tipe poin berbeda dan untuk daftar bernomor. Tetapi tidak selalu mengubah satu tipe penanda standar ke tipe penanda lainnya sudah cukup untuk membuat daftar terlihat cantik. Untuk mendesain daftar, lebih baik menggunakan CSS, yang memungkinkan Anda tidak hanya mengubah tampilan penanda, tetapi juga mengganti penanda dengan gambar, mengontrol posisinya, dan mengontrol lekukan. Anda dapat melihat bagaimana melakukan semua ini.
Daftar horisontal
Jika Anda menggunakan kotak daftar HTML untuk membuat menu horizontal, maka Anda perlu mengatur item daftar satu demi satu pada baris yang sama. Anda tidak akan dapat melakukannya menggunakan HTML, jadi Anda harus menggunakan CSS.
Untuk membuat daftar horizontal, Anda perlu menulis properti tampilan CSS untuk item daftar dengan nilai inline atau inline-block, tergantung pada properti lain yang akan Anda gunakan.
Judul halaman Daftar bernomor
- Apel
- Pisang
- Jeruk lemon
Daftar Berpoin:
- Apel
- Pisang
- Jeruk lemon
Setelah itu, semua item dalam daftar akan berbaris dalam satu baris. Harap dicatat bahwa poin akan hilang dari item daftar dan bahkan tidak akan ada spasi di antara mereka, tetapi indentasi di sebelah kiri daftar akan tetap ada.
Anda dapat melihat bagaimana daftar horizontal dapat diubah menjadi menu horizontal.
Direkomendasikan
Konversi sinyal oleh sirkuit parametrik linier
Metode klasik untuk menganalisis proses dalam rangkaian linier seringkali dikaitkan dengan kebutuhan akan transformasi yang rumit. Alternatif...
- yang berisi semua konten daftar yang ditampilkan):
Contoh 11.3. Buat daftar bernomor
Daftar bernomor Bekerja dengan waktu
Hasil dari contoh ini ditunjukkan pada Gambar. 11.3.
Beras. 11.3. Tampilan daftar bernomor
Perhatikan bahwa daftar bernomor juga menambahkan indentasi otomatis ke atas, bawah, dan kiri teks.
Nilai berikut dapat digunakan sebagai elemen penomoran:
Atribut type dari tag digunakan untuk menunjukkan jenis daftar bernomor.
- ... Nilai yang mungkin diberikan dalam tabel. 11.2.
tab. 11.2. Jenis daftar bernomor
Jenis daftar kode HTML Contoh angka arab
1. Cheburashka
2. Gena Buaya
3. ShapoklyakHuruf kapital dari alfabet Latin
A. Cheburashka
B. Gena Buaya
C. ShapoklyakHuruf kecil dari alfabet Latin
A. Cheburashka
B. Buaya Gena
C. ShapoklyakAngka romawi huruf besar
I. Cheburashka
II. Buaya Gena
AKU AKU AKU. ShapoklyakAngka romawi huruf kecil
Saya. Cheburashka
ii. Buaya Gena
aku aku aku. ShapoklyakUntuk memulai daftar pada nilai tertentu, gunakan atribut awal dari tag
- ... Tidak masalah jenis daftar apa yang diatur menggunakan jenis, atribut awal bekerja sama dengan angka Romawi dan Arab. Contoh 11.4 menunjukkan cara membuat daftar menggunakan angka romawi huruf besar dimulai dengan delapan.
Contoh 11.4. Penomoran daftar
angka Romawi Hasil dari contoh ini ditunjukkan pada Gambar. 11.4.
Beras. 11.4. Daftar bernomor dengan angka romawi
Dalam HTML, seluruh rangkaian tag bertanggung jawab untuk mengatur daftar, organisasi yang harus mengikuti aturan tertentu untuk menyusun data.
Standar kelima versi html 3 jenis daftar yang didukung: daftar bernomor, daftar berpoin dan daftar definisi. Ini juga menyediakan kemampuan untuk membuat daftar bersarang di dalam satu sama lain, membuat daftar bertingkat bersarang.
Daftar bernomor
Daftar bernomor adalah seperangkat elemen (daftar item) yang memiliki urutan tertentu. Setiap item dalam daftar bernomor memiliki penanda unik yang menunjukkan urutan penempatan item ini relatif terhadap item lain dalam daftar. Secara default, poin untuk item daftar bernomor adalah angka. Item pertama berada di bawah angka 1, yang kedua di bawah angka 2, dan seterusnya.
Contoh paling umum dari daftar bernomor adalah resep untuk berbagai hidangan. Karena resep apa pun adalah daftar bernomor dengan urutan tindakan yang jelas.
Untuk membuat daftar bernomor dalam HTML, gunakan tag
- , di mana elemen daftar dengan data berada. Setiap item dalam daftar ditandai dengan tag
Gaya untuk daftar bernomor
Contoh Arti Keterangan a, b, c alfa rendah Huruf kecil A, B, C alfa atas Huruf besar saya, ii, iii romawi rendah Angka Romawi dalam huruf kecil I, II, III romawi atas Angka romawi huruf besar Contoh: Menerapkan Properti CSS tipe-gaya-daftar
Daftar Berpoin
Daftar Berpoin sebenarnya, mereka mirip dengan yang bernomor hanya saja mereka tidak mengandung penomoran paragraf yang berurutan. Daftar berpoin dibuat menggunakan elemen blok
MenandaiDalam contoh berikut, Anda dapat melihat bahwa, secara default, penanda lingkaran kecil yang diisi ditambahkan di depan setiap item daftar:
Di dalam tag
Daftar bersarang
Daftar apa pun dapat bersarang di dalam daftar lain. elemen dalamContoh: Daftar Bersarang
Memformat daftar berpoin
Untuk perubahan penampilan penanda daftar harus menggunakan properti tipe-gaya-daftar lembar gaya CSS:
Contoh berikut menunjukkan berbagai gaya daftar berpoin:
Contoh: Gaya Daftar Berpoin
Cakram:
Lingkaran:
Persegi:
Tidak ada:
penanda grafis.
HTML memiliki kemampuan untuk membuat daftar dengan penanda grafis. Ini adalah satu hal ketika peluru daftar adalah lingkaran atau kotak standar, dan hal lain ketika pengembang sendiri memilih penanda sesuai dengan desain halaman. Gambar kecil sering digunakan untuk membuat item daftar terlihat cantik.
Untuk mengganti penanda biasa dengan penanda grafis, ganti properti tipe-gaya-daftar per properti daftar-gaya-gambar dan tentukan alamat URL gambar:Contoh: Penanda grafis
lambang Zodiak
lambang Zodiak
Definisi (deskripsi) daftar
Daftar definisi sangat berguna untuk membuat, misalnya, kosakata istilah pribadi Anda. Setiap item dalam daftar definisi memiliki dua bagian: istilah dan definisinya.
Anda menempatkan seluruh daftar dalam sebuah elemen
Daftar definisi sering digunakan dalam publikasi ilmiah, teknis, dan pendidikan, dengan bantuan glosarium, kamus, buku referensi, dll.Struktur umum daftar deskripsi adalah sebagai berikut:
Contoh berikut menunjukkan salah satu dari kemungkinan penggunaan daftar definisi:
Contoh: Daftar definisi
World Wide Web - dari bahasa Inggris. World Wide Web (WWW) adalah sistem terdistribusi yang menyediakan akses ke dokumen terkait yang terletak di berbagai komputer yang terhubung ke Internet. Internet adalah kumpulan jaringan yang menggunakan protokol pertukaran tunggal untuk mentransfer informasi. Situs - satu set halaman web individu yang dihubungkan oleh link dan desain tunggal.
Secara default, teks istilah ditekan ke tepi kiri jendela browser, dan deskripsi istilah diposisikan di bawah dan digeser ke kanan.
Daftar bernomor adalah kumpulan item dengan nomor urutnya. Jenis dan jenis penomoran tergantung pada atribut tag
- , yang digunakan untuk membuat daftar. Setiap item dalam daftar bernomor diidentifikasi oleh tag
Di sini: type adalah karakter dari daftar:
Jika Anda ingin daftar dimulai dengan angka selain 1, Anda harus menentukannya menggunakan atribut Mulailah menandai
Contoh berikut menunjukkan daftar bernomor dengan angka Romawi besar dan nilai awal XLIX:Anda dapat memulai penomoran dengan atribut nilai yang ditambahkan ke elemen
Contoh rekaman:
- .
- .
Entri semacam itu menentukan penomoran daftar dari huruf Latin huruf besar "E". Untuk jenis penomoran lainnya, entri START = 5 akan mengatur penomoran, masing-masing, dari angka "5", angka Romawi "V", dll.
Mengubah jenis penomoran daftar dan nilai angka dapat dilakukan untuk setiap elemen daftar. Menandai
- untuk daftar bernomor, memungkinkan parameter TYPE dan VALUE digunakan. Parameter TYPE dapat mengambil nilai yang sama seperti untuk tag.
Parameter COMPACT memiliki arti yang sama dengan daftar berpoin. Parameter TYPE digunakan untuk mengatur jenis penomoran daftar. Itu dapat mengambil nilai-nilai berikut:
TYPE = A - mengatur penanda dalam bentuk huruf Latin huruf besar;
TYPE = a - menentukan penanda dalam bentuk huruf kecil Latin;
TYPE = I - menentukan penanda dalam bentuk angka Romawi besar;
TYPE = i - menentukan penanda dalam bentuk angka Romawi kecil;
TYPE = 1 - menentukan penanda dalam bentuk angka Arab.
Secara default, nilai TYPE = 1 selalu digunakan, yaitu penomoran menggunakan angka Arab. Ini juga berlaku untuk daftar bernomor bersarang. Di sini, tidak seperti daftar berpoin, browser secara default tidak membuat penomoran yang berbeda di berbagai tingkat kumpulan daftar. Perhatikan bahwa setelah nomor elemen daftar, tanda "titik" selalu ditampilkan sebagai tambahan.
Parameter TYPE dengan nilai yang sama dapat digunakan untuk menentukan gaya penomoran item daftar individual. Untuk ini, parameter TYPE dengan nilai yang sesuai diizinkan untuk ditentukan dalam tag item daftar
Daftar jenis ini biasanya merupakan urutan item individual yang berurutan. Perbedaan dari daftar berpoin adalah bahwa dalam daftar bernomor setiap elemen secara otomatis didahului oleh nomor urut. Jenis penomoran tergantung pada browser dan dapat diatur oleh parameter tag daftar. Jika tidak, penerapan daftar bernomor sangat mirip dengan penerapan daftar berpoin.
Tag
- dan
Untuk membuat daftar bernomor, gunakan tag penampung yang berisi semua item daftar. Tag awal dan akhir daftar menyediakan umpan baris sebelum dan sesudah daftar, sehingga memisahkan daftar dari konten utama dokumen.
Seperti daftar berpoin, setiap item dalam daftar bernomor harus dimulai dengan tag
Berikut adalah contoh dokumen HTML yang menggunakan daftar definisi:
Contoh daftar definisi Klasifikasi temperamen manusia yang khas,
didirikantentang pandangan Hippocrates
Tampilan dokumen HTML yang diberikan di browser ditunjukkan pada Gambar. 2.5.
Beras. 2.5. Daftar definisi (menyerupai sekelompok entri dalam kamus)
Ketik Daftar
dan - .
Awalnya, jenis daftar ini dianggap lebih ringkas daripada daftar berpoin biasa. Menurut aturan untuk menulis elemen daftar ini, tidak diperbolehkan untuk menggunakan elemen blok di dalamnya, yang berarti tidak mungkin untuk mengimplementasikan kumpulan daftar jenis ini. Setiap item dalam daftar adalah satu baris teks.
Untuk daftar seperti
direncanakan untuk memperkenalkan pembatasan pada "panjang teks item daftar (24 karakter). Batasan seperti itu akan memungkinkan untuk diturunkan daftar seperti
dalam bentuk yang mirip dengan daftar direktori di sistem operasi UNIX dan MS-DOS saat menggunakan sakelar / W (beberapa kolom). Selain itu, penanda tidak ditampilkan untuk item daftar jenis ini. Saat ini, semua ide ini belum direalisasikan, karena penggunaan daftar jenis ini lebih lanjut tidak disarankan. Versi browser modern menampilkan daftar jenis ini dengan cara yang persis sama seperti daftar jenis
- .
Daftar bersarang
Ada kalanya item daftar dari satu jenis perlu menyertakan seluruh daftar dengan jenis yang sama atau lainnya. Ini akan mengatur daftar bertingkat atau bertingkat. HTML memungkinkan pembuatan berbagai jenis daftar secara sewenang-wenang, tetapi harus berhati-hati saat mengaturnya.
Di bawah ini adalah kode HTML dokumen dengan daftar bersarang, yang tampilannya ditunjukkan pada Gambar. 2.6. Dalam contoh ini, setiap item dalam daftar berpoin memiliki daftar bernomornya sendiri.
Contoh daftar bersarang Satelit dari beberapa planet
- , elemen level blok dapat ditemukan. Ini menyiratkan, khususnya, bahwa daftar definisi dapat disarangkan.
-
NS Contoh rekaman:
- .
- .
Entri semacam itu menentukan penomoran daftar dari huruf Latin huruf besar "E". Untuk jenis penomoran lainnya, entri START = 5 akan mengatur penomoran, masing-masing, dari angka "5", angka Romawi "V", dll.
Mengubah jenis penomoran daftar dan nilai angka dapat dilakukan untuk setiap elemen daftar. Menandai
- untuk daftar bernomor, memungkinkan parameter TYPE dan VALUE digunakan. Parameter TYPE dapat mengambil nilai yang sama seperti untuk tag.
Parameter COMPACT memiliki arti yang sama dengan daftar berpoin. Parameter TYPE digunakan untuk mengatur jenis penomoran daftar. Itu dapat mengambil nilai-nilai berikut:
TYPE = A - mengatur penanda dalam bentuk huruf Latin huruf besar;
TYPE = a - menentukan penanda dalam bentuk huruf kecil Latin;
TYPE = I - menentukan penanda dalam bentuk angka Romawi besar;
TYPE = i - menentukan penanda dalam bentuk angka Romawi kecil;
TYPE = 1 - menentukan penanda dalam bentuk angka Arab.
Secara default, nilai TYPE = 1 selalu digunakan, yaitu penomoran menggunakan angka Arab. Ini juga berlaku untuk daftar bernomor bersarang. Di sini, tidak seperti daftar berpoin, browser secara default tidak membuat penomoran yang berbeda di berbagai tingkat kumpulan daftar. Perhatikan bahwa setelah nomor elemen daftar, tanda "titik" selalu ditampilkan sebagai tambahan.
Parameter TYPE dengan nilai yang sama dapat digunakan untuk menentukan gaya penomoran item daftar individual. Untuk ini, parameter TYPE dengan nilai yang sesuai diizinkan untuk ditentukan dalam tag item daftar
Daftar jenis ini biasanya mewakili urutan elemen individu yang berurutan. Perbedaan dari daftar berpoin adalah bahwa dalam daftar bernomor setiap elemen secara otomatis didahului oleh nomor urut. Jenis penomoran tergantung pada browser dan dapat diatur oleh parameter tag daftar. Jika tidak, penerapan daftar bernomor sangat mirip dengan penerapan daftar berpoin.
Tag
- dan
Untuk membuat daftar bernomor, gunakan wadah tag, di dalamnya semua elemen daftar berada. Tag awal dan akhir daftar menyediakan umpan baris sebelum dan sesudah daftar, sehingga memisahkan daftar dari konten utama dokumen.
Seperti daftar berpoin, setiap item dalam daftar bernomor harus dimulai dengan tag
- yang menunjuk ke item daftar individual memberikan penanda item daftar standar.
Parameter COMPACT ditulis tanpa nilai dan digunakan untuk menginstruksikan browser untuk menampilkan daftar ini dalam format yang ringkas. Misalnya, font dapat dikurangi atau jarak antara baris daftar, dll.
Catatan
Saat ini, kehadiran parameter COMPACT di tag
- sama sekali tidak memengaruhi tampilan daftar oleh browser terkemuka. Oleh karena itu, penggunaan parameter ini tidak ada artinya, terutama karena penggunaannya tidak direkomendasikan oleh spesifikasi HTML 4.0.
Parameter TYPE dapat mengambil nilai berikut: disk, lingkaran dan persegi. Parameter ini digunakan untuk memaksa munculnya penanda daftar. Jenis penanda yang tepat akan tergantung pada browser yang digunakan. Opsi tampilan tipikal adalah sebagai berikut:
TYPE = disc - spidol ditampilkan dengan lingkaran penuh; TYPE = lingkaran - penanda ditampilkan dengan lingkaran terbuka; TYPE = square - spidol ditampilkan dengan kotak yang diisi. Contoh rekaman:
-
.
Standarnya adalah TYPE = disk. Untuk daftar berpoin bersarang, defaultnya adalah disk di tingkat pertama, lingkaran di tingkat kedua, dan kotak di tingkat ketiga dan seterusnya. Inilah yang dilakukan di versi terbaru Browser Netscape dan Internet Explorer... Perhatikan bahwa browser lain mungkin menampilkan penanda secara berbeda. Misalnya, spesifikasi HTML 4.0 menentukan garis persegi untuk tampilan penanda yang ditampilkan saat TYPE = square.
Parameter TYPE dengan nilai yang sama dapat digunakan untuk menentukan jenis penanda untuk item daftar individual. Untuk ini, parameter TYPE dengan nilai yang sesuai diizinkan untuk ditentukan dalam tag item daftar
- .
- ,
- ,
- , dengan bantuan daftar jenis ini yang diatur dalam dokumen HTML (UL - Daftar Tidak Terurut, daftar tidak berurutan).
Daftar berpoin menggunakan karakter khusus yang disebut peluru daftar (sering disebut peluru, yang merupakan pengucapan formal dari istilah peluru bahasa Inggris) untuk menyorot item-itemnya. Jenis penanda daftar ditentukan oleh browser, dan saat membuat daftar bersarang, browser akan secara otomatis mendiversifikasi tampilan penanda di berbagai tingkat bersarang.
Tag dan<LI>
Untuk membuat daftar berpoin, Anda perlu menggunakan wadah tag, di mana semua elemen daftar berada. Tag daftar pembuka dan penutup menyediakan umpan baris sebelum dan sesudah daftar, sehingga memisahkan daftar dari konten utama dokumen, jadi tidak perlu menggunakan tag paragraf di sini.
.
Setiap elemen daftar harus dimulai dengan tag
