Ada banyak tag-tag yang ada di HTML, salah satunya adalah tag <hr> (Horizontal Rule). Implementasi dari tag <hr> akan menghasilkan garis mendatar (horizontal) lurus antara kiri ke kanan atau sebaliknya. Tag ini biasanya sering kali digunakan sebagai pemisah antara satu paragraf dengan paragraf yang lainnya atau sering disebut dengan thematic break, dan juga dapat disisipkan dimana saja sesuai keinginan.
Salah satu hal unik dari tag ini adalah penggunaannya sangat berbeda dengan tag-tag lainnya, jika tag lain memerlukan sebuah penutup maka tag <hr> tidak memerlukan sebuah tag penutup </hr> dan hanya cukup ditulis dengan <hr> saja untuk penggunaannya.
Contoh source code tag <hr> :
<!DOCTYPE html>
<html>
<head>
<title>Tag HR</title>
</head>
<body>
<p>ini sebuah teks</p>
<hr>
<p>ini sebuah teks juga</p>
<hr>
</body>
</html>
<html>
<head>
<title>Tag HR</title>
</head>
<body>
<p>ini sebuah teks</p>
<hr>
<p>ini sebuah teks juga</p>
<hr>
</body>
</html>
Maka akan menghasilkan seperti ini :
Pada contoh diatas merupakan penggunaan tag <hr> secara defaultnya (bawaan). Apabila ingin mempercantik dengan menambahkan warna pada garisnya tinggal tambahkan saja atribut "color".
Maka akan menghasilkan seperti ini :
Selain atribut warna, juga bisa menambahkan ukuran dari garis horizontal tersebut. Caranya gampang banget tinggal menambahkan atribut "size" di dalam tag <hr>.
Maka akan menghasilkan seperti ini :
Baca Juga : Struktur Dasar HTMLContoh source code tag <hr> dengan tambahan warna :
<!DOCTYPE html>
<html>
<head>
<title>Tag HR</title>
</head>
<body>
<p>ini sebuah teks</p>
<hr color="yellow">
<p>ini sebuah teks juga</p>
<hr color="green">
</body>
</html>
<html>
<head>
<title>Tag HR</title>
</head>
<body>
<p>ini sebuah teks</p>
<hr color="yellow">
<p>ini sebuah teks juga</p>
<hr color="green">
</body>
</html>
Selain atribut warna, juga bisa menambahkan ukuran dari garis horizontal tersebut. Caranya gampang banget tinggal menambahkan atribut "size" di dalam tag <hr>.
Baca Juga : Mengenal Tag HTML, Head, Title, BodyContoh source code tag <hr> dengan tambahan ukuran garis :
<!DOCTYPE html>
<html>
<head>
<title>Tag HR</title></head><body>
<p>ini sebuah teks</p>
<hr color="yellow" size="5px">
<p>ini sebuah teks juga</p>
<hr color="green" size="15px">
</body>
</html>
<html>
<head>
<title>Tag HR</title></head><body>
<p>ini sebuah teks</p>
<hr color="yellow" size="5px">
<p>ini sebuah teks juga</p>
<hr color="green" size="15px">
</body>
</html>
Tidak ada komentar:
Posting Komentar
Tolong berkomentar dengan sopan dan baik, Terimakasih.