Satu lagi tag HTML yang dapat kita manfaatkan untuk mempermanis tampilan posting pada Blogger. Tag tersebut adalah tag <hr>. Tag ini digunakan untuk membuat garis batas horizontal. Saat menuliskan tag ini di Edit HTML, kita perlu menambahkan garis miring (/) sehingga penulisan tagnya menjadi <hr />. Tag ini memiliki beberapa atribut sebagai berikut:
Atribut | Fungsi |
align | Untuk menentukan posisi vertikal garis pemisah. Nilainya bisa left, right, atau center. |
color | Untuk menentukan warna dari garis batas. |
noshade | Untuk menonaktifkan efek tiga dimensi. |
size | Untuk menentukan tebal garis batas. |
width | Untuk menentukan lebar dari garis batas. Nilainya bisa berupa piksel atau persen dari lebar halaman posting. |
Berikut ini contoh dari macam-macam garis batas yang dapat dibuat dengan menggunakan atribut-atribut di atas.
1. Garis batas biasa.
Penulisan di Edit HTML:
<hr />
Hasil:
2. Garis batas dengan posisi di kanan dengan lebar 200 piksel.
Penulisan di Edit HTML:
<hr align="right" width="200" />
Hasil:
3. Garis batas dengan lebar 50 piksel.
Penulisan di Edit HTML:
<hr width="50" />
Hasil:
4. Garis batas dengan lebar 50% dari lebar halaman posting.
Penulisan di edit HTML:
<hr width="50%" />
Hasil:
5. Garis batas dengan warna tertentu. Misalnya warna Fuchsia (Merah Keunguan).
Penulisan di Edit HTML:
<hr color="#FF00FF" />
Hasil:
6. Garis batas dengan tebal 7 piksel.
Penulisan di Edit HTML:
<hr size="7" />
Hasil:
7. Garis batas dengan tebal 5 piksel dan berwarna biru.
Penulisan di Edit HTML:
<hr color="#0000FF" size="5" />
Hasil:
8. Garis batas tanpa efek tiga dimensi.
Penulisan di Edit HTML:
<hr noshade="noshade" />
Hasil:
Anda dapat mencoba-coba sendiri dengan menggabungkan beberapa atribut lainnya untuk mengetahui hasilnya. Semoga bermanfaat..
Terima kasih tutorialnya,sob.
ReplyDeletesangat bermanfaat..
@goez Terima kasih kembali Sob..
ReplyDeleteWah Baru tahu saya, Trima Kasih mas.
ReplyDelete@Francisco Xavier Sama-sama Mas..
ReplyDeletenah, ketemu juga nih cara ..
ReplyDeletemakasih ya sob
Thankyu Gan atas bagi ngilmunya...
ReplyDeleteSalam Sukses
sipp gan, ini yang aku cari selama ini
ReplyDeletela ini yang saya cari2, akhirnya ketemu juga
ReplyDeletehehehehe
makasih gan
terima kasih mas caranya. langsung praktek
ReplyDeleteCara pasang garis pemisah seperti widget artikel terkait seperti related post diatas gimana yah
ReplyDeletePost a Comment