Mengetahui HTML Basic : Headings, Lines, Comments | KodeGua

Mengetahui HTML Basic : Headings, Lines, Comments

Dalam HTML, Anda dapat menggunakan judul, garis horizontal, dan komentar untuk menyusun dan memberi anotasi pada konten halaman web Anda. Berikut cara menggunakan masing-masing elemen tersebut:

1. HTML Headings

HTML menyediakan enam tingkatan judul, dari <h1> (tingkat tertinggi) hingga <h6> (tingkat terendah). Judul digunakan untuk menentukan struktur konten Anda, dengan <h1> sebagai judul utama halaman dan <h6> mewakili subjudul. Berikut ini contohnya:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Navbar Example</title>
    <link rel="stylesheet" href="styles.css"> <!-- Hubungkan file CSS Anda di sini -->
</head>
<body>
    <h1>This is a Heading Level 1</h1>
    <h2>This is a Heading Level 2</h2>
    <h3>This is a Heading Level 3</h3>
    <h4>This is a Heading Level 2</h4>
    <h5>This is a Heading Level 3</h5>
    <h6>This is a Heading Level 2</h6>

</body>
</html>

2. Horizontal Lines

Anda dapat menggunakan elemen <hr> untuk menyisipkan garis horizontal untuk memisahkan konten di halaman web. Elemen <hr> dapat menutup sendiri dan tidak memerlukan tag penutup. Berikut ini contohnya:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Navbar Example</title>
    <link rel="stylesheet" href="styles.css"> <!-- Hubungkan file CSS Anda di sini -->
</head>
<body>
    <h1>This is a Heading Level 1</h1>
    <h2>This is a Heading Level 2</h2>
    <h3>This is a Heading Level 3</h3>
    <h4>This is a Heading Level 2</h4>
    <h5>This is a Heading Level 3</h5>
    <h6>This is a Heading Level 2</h6> 
<p>This is some text above the line.</p>
<hr>
<p>This is some text below the line.</p>

</body>
</html>

3. Comments

Anda dapat menambahkan komentar ke kode HTML Anda menggunakan sintaks . Komentar tidak terlihat di halaman web dan biasanya digunakan untuk memberikan catatan atau penjelasan di dalam kode. Berikut cara menambahkan komentar:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Navbar Example</title>
    <link rel="stylesheet" href="styles.css"> <!-- Hubungkan file CSS Anda di sini -->
</head>
<body>
    <h1>This is a Heading Level 1</h1>
    <h2>This is a Heading Level 2</h2>
    <h3>This is a Heading Level 3</h3>
    <h4>This is a Heading Level 2</h4>
    <h5>This is a Heading Level 3</h5>
    <h6>This is a Heading Level 2</h6> 
<p>This is some text above the line.</p>
<hr>
<p>This is some text below the line.</p>
<!-- This is a comment. It won't be visible on the web page. -->
<p>This is some content.</p>

</body>
</html>

Komentar berguna untuk mendokumentasikan kode Anda atau menghapus sementara elemen tanpa menghapusnya.

Ini adalah contoh dasar bagaimana Anda dapat menggunakan judul, garis horizontal, dan komentar dalam dokumen HTML untuk menyusun dan memberi anotasi pada halaman web Anda.

KodeGua

Cari Blog Ini