Home » HTML » Heading di HTML: Contoh Code dan Cara Membuatnya

Heading di HTML: Contoh Code dan Cara Membuatnya

by Catur Kurnia Sari
by Catur Kurnia Sari

Heading pada HTML digunakan untuk menentukan judul atau subjudul yang ingin ditampilkan pada halaman web.

Contoh :

<!DOCTYPE html>
<html>
<body>

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

</body>
</html>

Heading HTML

Heading pad HTML dapat ditentukan dengan menggunakan tag <h1> sampai <h6>.

<h1> mendefinisikan sebuah heading yang paling penting. Dan <h6> mendefinisikan sebuah heading yang tidak terlalu penting.

Contoh :

<!DOCTYPE html>
<html>
<body>

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

</body>
</html>

Catatan: Browser secara otomatis akan menambahkan beberapa spasi (margin) sebelum dan sesudah heading.

Heading itu Penting

Mesin pencari menggunakan sebuah heading untuk mengindeks struktur dan konten halaman web.

Pengguna juga sering kali membaca sepintas halaman berdasarkan heading (judul). Penting untuk menggunakan heading untuk memperlihatkan struktur dokumen.

Penggunaan tag heading <h1> sebaiknya digunakan untuk heading utama, diikuti dengan heading <h2>, dan heading <h3> yang kurang penting, dan seterusnya.

Catatan: Gunakan heading HTML untuk judul saja. Jangan gunakan heading untuk membuat teks BESAR atau tebal.

Heading yang lebih Besar

Setiap heading pada HTML pasti memiliki ukuran default. Namun, jika ingin mengubahnya maka kita dapat menentukan ukuran untuk setiap heading dengan atribut style dan menggunakan properti CSS font-size.

Contoh :

<!DOCTYPE html>
<html>
<body>

<h1 style="font-size:60px;">Heading 1</h1>

<p>Anda dapat mengubah ukuran heading dengan atribut style, menggunakan properti font-size pada CSS.</p>

</body>
</html>

Tag HTML

TagDeskripsi
<html>Mendefinisikan root dari dokumen HTML
<body>Mendefinisikan badan dokumen
<h1> sampai <h6>Mendefinisikan heading (judul) pada dokumen HTML

You may also like