Tag HR digunakan dalam dokumen web untuk menampilkan garis horizontal di halaman, atau terkadang disebut aturan horizontal. Tidak seperti beberapa tag, yang satu ini tidak membutuhkan tag penutup, jadi yang harus Anda lakukan hanyalah mengetik untuk memasukkan garis.
Garis membentang di seluruh lebar halaman dan membawa beberapa atribut default untuk menggambarkan ketebalan, lokasi, dan warna garis, tetapi Anda dapat mengubah pengaturan tersebut jika Anda mau.
Anda dapat mengedit karakteristik garis horizontal dalam dokumen HTML5 dengan mengedit CSS halaman. Garis horizontal HTML4 diubah pada sisi HTML dokumen.
Apakah Semantic Tag HR?
Dalam HTML4, tag HR tidak semantik. Elemen semantik menggambarkan maknanya dalam istilah peramban dan pengembang dapat dengan mudah memahami. Tag HR hanyalah cara untuk menambahkan garis sederhana ke dokumen di mana pun Anda menginginkannya. Hanya styling perbatasan atas atau bawah dari elemen di mana Anda ingin garis muncul menempatkan garis horizontal di bagian atas atau bawah elemen, tetapi secara umum, tag HR lebih mudah digunakan untuk tujuan ini.
Dimulai dengan HTML5, tag HR menjadi semantik, dan sekarang mendefinisikan istirahat tematis paragraf tingkat, yang merupakan istirahat dalam aliran konten yang tidak menjamin halaman baru atau pembatas lain yang lebih kuat - ini adalah perubahan topik. Misalnya, Anda mungkin menemukan tag SDM setelah perubahan adegan dalam sebuah cerita, atau dapat menunjukkan perubahan topik dalam dokumen referensi.
Atribut SDM dalam HTML4 dan HTML5
Dalam HTML4, tag HR dapat diberi atribut sederhana termasuk sejajarkan, lebar, dan noshade . Penyelarasan dapat diatur ke kiri , pusat , kanan atau membenarkan . Lebar menyesuaikan lebar garis horizontal dari default 100 persen yang memanjang garis di seluruh halaman. Itu noshade atribut membuat garis warna yang solid, bukan warna yang diarsir.
Atribut ini sudah usang dalam HTML5. Sebagai gantinya, Anda harus menggunakan CSS untuk menata tag SDM Anda dalam dokumen HTML5.
Ini adalah contoh HTML5 dari stylizing garis horizontal menjadi 10 piksel tinggi menggunakan CSS inline (gaya dimasukkan langsung ke dalam dokumen bersama dengan HTML):
Cara lain untuk mengatur garis horizontal dalam HTML5 adalah dengan menggunakan file CSS terpisah, dan menautkannya ke dokumen HTML. Di file CSS, Anda akan menulis styling seperti ini: jam {tinggi: 10 piksel}
Efek yang sama dalam HTML4 mengharuskan Anda menambahkan atribut ke konten HTML. Berikut cara mengubah ukuran garis horizontal dengan ukuran atribut:
Ada lebih banyak kebebasan dalam menata garis horizontal dalam CSS versus HTML. Hanya itu lebar dan tinggi gaya konsisten di semua browser, sehingga beberapa trial and error mungkin diperlukan saat menggunakan gaya lain. Lebar default selalu 100 persen dari lebar halaman web atau elemen induk. Tinggi default aturan adalah dua piksel.
