Sebelumnya saya ucapkan selamat datang di blog jual rebanamarawis ini, kali ini saya akan menulis tentang Bagaimana Cara Membuat Bullets dengan Numbering Tag HTML pada Posting Blog.
Dalam sebuah karya tulis atau tulisan seringkali kita jumpai daftar item (list), baik berupa penomoran (numbering) maupun bullet yang berfungsi untuk memberikan label atau urutan agar tulisan tersebut terstruktur dengan rapi sehingga dapat dipahami dengan mudah oleh para pembacanya.
Sebenarnya pada post editor blog sudah tersedia fasilitas untuk membuat list baik numbering maupun bullet, untuk blogspot sendiri fasilitas ini terdapat pada mode "Tulis" atau "Compose" yaitu berupa icon, dan penggunaannya cukup dengan meng klik icon tersebut. namun penggunaan fasilitas ini dirasa kurang praktis dan kurang memadai, terutama karena kurangnya variasi type numbering maupun bullet, juga pada saat kita hendak menggunakan list yang bertingkat.
HTML mendukung beberapa format list, baik numbering List dan bullets List.
Dalam sebuah karya tulis atau tulisan seringkali kita jumpai daftar item (list), baik berupa penomoran (numbering) maupun bullet yang berfungsi untuk memberikan label atau urutan agar tulisan tersebut terstruktur dengan rapi sehingga dapat dipahami dengan mudah oleh para pembacanya.
Sebenarnya pada post editor blog sudah tersedia fasilitas untuk membuat list baik numbering maupun bullet, untuk blogspot sendiri fasilitas ini terdapat pada mode "Tulis" atau "Compose" yaitu berupa icon, dan penggunaannya cukup dengan meng klik icon tersebut. namun penggunaan fasilitas ini dirasa kurang praktis dan kurang memadai, terutama karena kurangnya variasi type numbering maupun bullet, juga pada saat kita hendak menggunakan list yang bertingkat.
HTML mendukung beberapa format list, baik numbering List dan bullets List.
- Tag HTML Numbering List
Ada beberapa tipe Penomoran (numbering list) antara lain:- type umum (default) dari Numbering adalah lambang bilangan (1,2,3,... dst)
Adapun Tag HTML yang digunakan untuk type ini, dibuka dengan kode <ol> dan ditutup dengan kode </ol> , sedangkan untuk masing masing item /list dibuka dengan <li> dan ditutup dengan </li>.
Contoh:<ol>
<li>urutan ke-1</li>
<li>urutan ke-2</li>
<li>urutan ke-3</li>
<li>urutan seterusnya...</li>
</ol>
Hasilnya akan terlihat seperti ini:
Contoh:- urutan ke-1
- urutan ke-2
- urutan ke-3
- urutan seterusnya...
Ket: Tag ini selalu berpasangan - Huruf romawi (I, II, III, ... atau i, ii, iii,... ),
Adapun Tag HTML yang digunakan untuk type ini, dibuka dengan kode <ol type="I"> dan ditutup dengan kode </ol> , sedangkan untuk masing masing item /list dibuka dengan <li> dan ditutup dengan </li>.
Contoh:<ol type="I">
<li>urutan ke-1</li>
<li>urutan ke-2</li>
<li>urutan ke-3</li>
<li>urutan seterusnya...</li></ol>
Hasilnya akan terlihat seperti ini:
Contoh:- urutan ke-1
- urutan ke-2
- urutan ke-3
- urutan seterusnya...
- Huruf Alfabet ( A,B,C,... atau a,b,c,...)
Adapun Tag HTML yang digunakan untuk type ini, dibuka dengan kode <ol type="A"> dan ditutup dengan kode </ol> , sedangkan untuk masing masing item /list dibuka dengan <li> dan ditutup dengan </li>.
Contoh:<ol type="I">
<li>urutan ke-1</li>
<li>urutan ke-2</li>
<li>urutan ke-3</li>
<li>urutan seterusnya...</li></ol>
Hasilnya akan terlihat seperti ini:
Contoh:- urutan ke-1
- urutan ke-2
- urutan ke-3
- urutan seterusnya...
- type umum (default) dari Numbering adalah lambang bilangan (1,2,3,... dst)
- Tag HTML Bullet List
Ada beberapa tipe Bullet (bullet list) antara lain:- Tipe Disc,
Penulisan Tag HTML nya( contoh agar jarak antar barisnya tidak terlalu jauh maka penulisan tagnya tidak perlu ganti baris (tidah usah di enter)
Contoh:<ul type="Disc"> <li>urutan ke-1</li> <li>urutan ke-2</li> <li>urutan ke-3</li> <li>urutan seterusnya...</li></ul>
Hasilnya:
Contoh:- urutan ke-1
- urutan ke-2
- urutan ke-3
- urutan seterusnya...
- Tipe Circle
Penulisan Tag HTML nya ( contoh agar jarak antar barisnya tidak terlalu jauh maka penulisan tagnya tidak perlu ganti baris (tidah usah di enter)
Contoh:<ul type="Circle"> <li>urutan ke-1</li> <li>urutan ke-2</li> <li>urutan ke-3</li> <li>urutan seterusnya...</li></ul>
Hasilnya sbb:
Contoh:- urutan ke-1
- urutan ke-2
- urutan ke-3
- urutan seterusnya...
- Tipe Square
Penulisan Tag HTML nya ( contoh agar jarak antar barisnya tidak terlalu jauh maka penulisan tagnya tidak perlu ganti baris (tidah usah di enter)
Contoh:<ul type="Square">
<li>urutan ke-1</li><li>urutan ke-2</li><li>urutan ke-3</li><li>urutan seterusnya...</li></ul>
Hasilnya sebagai berikut:
Contoh:- urutan ke-1
- urutan ke-2
- urutan ke-3
- urutan seterusnya...
- Tipe Disc,
Contoh Penulisan Tag HTML Bertingkat Selamat mencoba:
<ol type="I"><li>Tingkat I-a <ol type="1"><li>Tingkat ke-2a<ol type="a"><li>Tingkat ke-a</li><ul type="square"><li>square 1</li><li>square 2</li></ul><li>tingkat ke a-2<ul type="disc"><li>disc 1</li><li>disc 2</li></ul></li></ol></li><li>Tingkat ke-2b<ol type="a"><li>Tingkat ke-a</li><ul type="square"><li>square 1</li><li>square 2</li></ul><li>tingkat ke a-2<ul type="disc"><li>disc 1</li><li>disc 2</li></ul></li></ol></li></ol></li>
<li>tingkat I-b<ul type="disc"><li>disc 1<ol type="a"><li>pertama</li><li>kedua</li></ol></li><li>disc 2<ol type="<i""><li>pertama</li><li>kedua</li>
</ol></li></ul>
</li></ol>
Hasilnya seperti ini:
- Tingkat I-a
- Tingkat ke-2a
- Tingkat ke-a
- square 1
- square 2
- tingkat ke a-2
- disc 1
- disc 2
- Tingkat ke-2b
- Tingkat ke-a
- square 1
- square 2
- tingkat ke a-2
- disc 1
- disc 2
- Tingkat ke-2a
- tingkat I-b
- disc 1
- pertama
- kedua
- disc 2
- pertama
- kedua
- disc 1
Demikian postingan kali ini mengenai cara Cara Membuat Bullets dan Numbering Tag HTML pada Posting Blog semoga bermanfaat.
Artikel yang lainnya:
Artikel lainnya: