Cara Menambahkan Garis Horizontal di HTML dengan <hr>
Garis horizontal atau horizontal rule adalah elemen HTML yang digunakan untuk membagi konten menjadi bagian-bagian yang berbeda. Elemen ini ditampilkan sebagai garis tipis yang membentang di seluruh lebar halaman web.
Sintaks
Elemen hr
sangat sederhana dan tidak memiliki atribut. Berikut adalah sintaks dasar untuk menambahkan garis horizontal:
Contoh Penggunaan
Berikut adalah contoh bagaimana menggunakan elemen hr
dalam HTML:
Contoh Garis Horizontal
Judul Utama
Paragraf pertama.
Judul Bagian Kedua
Paragraf kedua.
Kode di atas akan menghasilkan halaman web dengan dua bagian yang dipisahkan oleh garis horizontal.
Atribut Elemen hr
Meskipun elemen hr
tidak memiliki atribut yang diperlukan, Anda dapat menggunakan beberapa atribut untuk mengatur penampilan garis horizontal.
size
: Mengatur ketebalan garis dalam piksel.width
: Mengatur lebar garis dalam piksel atau persentase.align
: Mengatur posisi garis horizontal. Nilai yang valid adalah "left", "center", dan "right".color
: Mengatur warna garis horizontal.
Contoh penggunaan atribut:
Kode di atas akan menghasilkan garis horizontal berwarna merah dengan ketebalan 5 piksel, lebar 50% dari lebar halaman, dan dipusatkan secara horizontal.
Penjelasan
Elemen hr
adalah cara yang mudah dan efektif untuk memisahkan konten di halaman web Anda. Ia membantu meningkatkan keterbacaan dan membuat halaman lebih terstruktur. Anda dapat menggunakannya untuk memisahkan bagian yang berbeda, judul, atau bagian konten lainnya.
Catatan
Meskipun elemen hr
masih didukung oleh semua browser web modern, penggunaan elemen ini saat ini sedang dibatasi. Sebaiknya gunakan elemen lain seperti <div>
dengan CSS untuk memisahkan konten jika Anda menginginkan kontrol yang lebih baik atas penampilan garis horizontal.