Saturday, March 11, 2017

Membuat Bullet Numbering di HTML

Membuat Bullet Numbering di HTML - Pembuatan bullet numbering digunakan ketika kita akan membuat sesuatu yang secara terdaftar kebawah. Dalam pengurutannya ada yang menggunakan angka, huruf abjad, huruf romawi dan itulah pengurutan daftar nama secara terurut atau biasa dikenal dengan ordered list, kemudian selain itu ada lagi pengurutan namanya tidak terurut atau biasa di kenal dengan unordered list. Pada postingan kali ini akan sama - sama membahas kedua - duanya, berbicara mengenai bullet numbering biasa kita lihat ketika mengetikan kata - kata di salah satu software pengolahan kata, katakan saja MS Word. Pembuatannya pun amat mudah cukup drag n drop saja, Nah pada kasus kali ini akan sama - sama membahas bagaimana caranya membuat bullet numbering di HTML dimulai dengan sintax/kode yang nantinya kita ketikan.

Seperti yang kita tahu pada postingan sebelumnya bahwa HTML merupakan bahasa struktur untuk menampilkan sesuatu baik itu teks atau gambar di web browser dan hasil akhirnya adalah berbentuk website. Pada awal postingan diatas bahwa yang akan kita buat sekarang adalah bullet numbering, bagaimana implementasi dari masing - masing jenis pengurutan daftar nya, simak dibawah ini ya. . . :
Bullet, termasuk kedalam unordered list atau dengan tag <ul> karena urutannya tidak terurut dalam artian setiap daftar menggunakan simbol saja. simbol yang bisa digunakan "disc", "circle", "square", "none".
Numbering, termasuk kedalam ordered list atau dengan tag <ol> karena urutannya berurut dalam artian tidak memakai simbol namun yang digunakan adalah "a", "A", "1", "I", "i".
Elemen yang digunakan dalam tag <ul> atau <ol> ini adalah <li> artinya list item.

Tools
  • Web Editor (Notepad)
  • Web Browser (Mozilla)
Screenshot
contoh bullet
Contoh bullet
contoh numbering
contoh numbering
Membuat Bullet
Ketikan kedalam web editor


<p>dengan type disc</p>

<ul type="disc">

<li>Laptop</li>

<li>PC</li>

</ul>



<p>dengan type circle</p>

<ul type="circle">

<li>Laptop</li>

<li>PC</li>

</ul>



<p>dengan type square</p>

<ul type="square">

<li>Laptop</li>

<li>PC</li>

</ul>



<p>dengan type none</p>

<ul type="none">

<li>Laptop</li>

<li>PC</li>

</ul>

Simpan dengan ekstensi *.html atau dengan nama bullet.html

Membuat Numbering
Ketikan kedalam web editor


<p>dengan type a</p>

<ol type="a">

<li>Motor</li>

<li>Mobil</li>

<li>Becak</li>

</ol>



<p>dengan type A</p>

<ol type="A">

<li>Motor</li>

<li>Mobil</li>

<li>Becak</li>

</ol>



<p>dengan type 1</p>

<ol type="1">

<li>Motor</li>

<li>Mobil</li>

<li>Becak</li>

</ol>



<p>dengan type i</p>

<ol type="i">

<li>Motor</li>

<li>Mobil</li>

<li>Becak</li>

</ol>



<p>dengan type I</p>

<ol type="I">

<li>Motor</li>

<li>Mobil</li>

<li>Becak</li>

</ol>

Simpan dengan ekstensi *.html atau dengan nama numbering.html

No comments:

Post a Comment