Kursus IT Dasar HTML 010_Elemen, Atribut

Elemen

Tag pembuka	Konten elemen	Tag penutup
`<h1>`	Ini adalah judul	`</h1>`
`<p>`	Ini adalah paragraf	`</p>`
`<a href="https://www.zhaojian.net/" title="Tautan">`	Ini adalah tautan	`</a>`
`<img src="/images/logo.png" alt="Ini adalah gambar">`	Ini adalah gambar
`<br>`	Baris baru

1
<!DOCTYPE html>
2
<html lang="en">
3

4
    <head>
5
        <meta charset="UTF-8" />
6
        <title>hello HTML</title>
7
    </head>
8

9
    <body>
10
        <h1>Ini adalah judul</h1>
11
        <p>
12
            Ini adalah paragraf<br>
13
            <a href="https://www.zhaojian.net/" title="Tautan">Ini adalah tautan</a>
14
        </p>
15
        <img src="/images/logo.png" alt="Ini adalah gambar" />
16
        <br />
17
    </body>
18

19
</html>

[!Ringkasan]

Elemen HTML dimulai dengan tag pembuka (awal) dan diakhiri dengan tag penutup (akhir)

Konten elemen HTML adalah konten di antara tag pembuka dan tag penutup

Beberapa elemen HTML memiliki konten kosong (empty content). Elemen tanpa konten dan tanpa tag penutup ini disebut tag kosong atau elemen kosong, untuk mengimplementasikan fungsi tertentu sambil mempertahankan kesederhanaan dan fleksibilitas, seperti: <br>, <hr>, <img>, <meta>, <input>, dll.

Sebagian besar elemen HTML dapat memiliki atribut

Elemen HTML biasanya disebut tag HTML (HTML tag)

Elemen HTML biasanya muncul berpasangan, misalnya <p> dan </p>

Elemen HTML dapat menyarangkan tag HTML lainnya

Elemen HTML tidak peka terhadap huruf besar/kecil, penggunaan huruf kecil direkomendasikan

Atribut

Elemen HTML dapat memiliki atribut (Attribute) yang memberikan informasi lebih lanjut tentang elemen atau mendefinisikan perilaku tertentu dari elemen. Atribut selalu didefinisikan dalam tag pembuka dan biasanya muncul dalam bentuk “nama_atribut=nilai_atribut”. Misalnya, elemen tautan (a) dapat menggunakan atribut href untuk menentukan alamat tujuan tautan:

Contoh:

1
<a href="https://www.zhaojian.net">zhaoJian.Net</a>

Hasil:

Efek contoh

Dalam kode di atas, atribut href dari elemen a memiliki nilai "https://www.zhaojian.net", yang berarti ketika tautan diklik, browser akan melompat ke URL tersebut.

Atribut yang umum digunakan:

id: Memberikan pengenal unik untuk elemen.
class: Memberikan satu atau beberapa nama kelas untuk elemen. Elemen yang berbeda dapat memiliki nama kelas yang sama.
style: Memberikan gaya inline untuk elemen.
title: Menambahkan konten judul ke elemen tautan.
alt: Menambahkan konten deskripsi ke elemen gambar.

[!Ringkasan]

Atribut selalu muncul dalam bentuk pasangan nama-nilai, misalnya: name="value".

Harus ada spasi antara atribut dan nama elemen (atau atribut sebelumnya, jika ada lebih dari satu atribut).

Nilai atribut harus selalu diapit tanda kutip. Tanda kutip ganda adalah yang paling umum, tetapi menggunakan tanda kutip tunggal juga tidak masalah.

Atribut dan nilai atribut tidak peka terhadap huruf besar/kecil, penggunaan huruf kecil direkomendasikan.

Elemen

Atribut

Komentar