Tag Pada HTML Part 1 : Basic Tag

Tag HTML merupakan kata kunci yang dikelilingi oleh kurung sudut (<nama_tag>). Setiap tag pada HTML harus diawali dengan tag pembuka (<nama_tag>) dan diakhiri dengan tag penutup (</nama_tag>). Oh iya maaf sebelumnya saya belum ngucapin salam... hehe

Assalamu'alaikum poinreaders,
Pada artikel kali ini saya akan membahas materi tentang tag pada html, mulai dari nama tag, fungsi, format penulisan, contoh serta output yang dihasilkan. Oke langsung saja simak ulasannya...

1.

Fungsi :

Membuat sebuah komentar. Tag ini tidak akan terlihat pada browser.

Format Penulisan :

Contoh Penulisan :

<!DOCTYPE HTML>
<html>
<head>
<title>Tag Komentar</title>
</head>
<body>


Hello World!

</body>
</html>

Hasil :

Hello World!

2. <!DOCTYPE>

Fungsi :

Mendefinisikan informasi tipe dokumen.

Format Penulisan :

<!DOCTYPE tipe_dokumen>

Contoh Penulisan :

<!DOCTYPE HTML>
<html>
<head>
<title>Tag !DOCTYPE</title>
</head>
<body>

Hello World!

</body>
</html>

Hasil :

Hello World!

3. <html>

Fungsi :

Mendefinisikan sebuah dokumen HTML.

Format Penulisan :

<html>...</html>

Contoh Penulisan :

<!DOCTYPE HTML>
<html>
<head>
<title>Tag HTML</title>
</head>
<body>

Hello World!

</body>
</html>

Hasil :

Hello World!

4. <title>

Fungsi :

Mendefinisikan judul dokumen.

Format Penulisan :

<title>...</title>

Contoh Penulisan :

<!DOCTYPE HTML>
<html>
<head>
<title>Tag title</title>
</head>
<body>

Hello World!

</body>
</html>

Hasil :

Hello World!

5. <body>

Fungsi :

Mendefinisikan body/isi dokumen (berupa teks, gambar, animasi, dll).

Format Penulisan :

<body>...</body>

Contoh Penulisan :

<!DOCTYPE HTML>
<html>
<head>
<title>Tag body</title>
</head>
<body>

Hello World!

</body>
</html>

Hasil :

Hello World!

6. <h1> sampai <h6>

Fungsi :

Mendefinisikan header/judul pada dokumen HTML.

Format Penulisan :

<h1>...</h1>
<h2>...</h2>
<h3>...</h3>
<h4>...</h4>
<h5>...</h5>
<h6>...</h6>

Contoh Penulisan :

<!DOCTYPE HTML>
<html>
<head>
<title>Tag Header</title>
</head>
<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>

Hasil :

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

6. <p>

Fungsi :

Membuat sebuah paragraf.

Format Penulisan :

<p>...</p>

Contoh Penulisan :

<!DOCTYPE HTML>
<html>
<head>
<title>Tag Paragraf</title>
</head>
<body>

<p>Ini adalah sebuah paragraf pertama.</p>
<p>Ini adalah sebuah paragraf kedua.</p>

</body>
</html>

Hasil :

Ini adalah sebuah paragraf pertama.
Ini adalah sebuah paragraf kedua.

7. <br>

Fungsi :

Membuat baris baru.

Format Penulisan :

<br>

Contoh Penulisan :

<!DOCTYPE HTML>
<html>
<head>
<title>Tag Break</title>
</head>
<body>

Ini adalah text pertama.
<br>
Ini adalah text kedua.

</body>
</html>

Hasil :

Ini adalah text pertama.
Ini adalah text kedua.

6. <hr>

Fungsi :

Membuat garis horizontal.

Format Penulisan :

<hr>

Contoh Penulisan :

<!DOCTYPE HTML>
<html>
<head>
<title>Tag Horizontal</title>
</head>
<body>

Ini adalah text pertama.
<hr>
Ini adalah text kedua.

</body>
</html>

Hasil :

Ini adalah text pertama.

Ini adalah text kedua.

Semoga materi yang saya sampaikan kali ini dapat bermanfaat bagi sobat poinreaders, jangan lupa follow akun sosial kami agar sobat poinreaders bisa mendapatkan materi terupdate tentang pemrograman lainnya.