Scribd
Unggah
12 tayangan29 halaman

Belajar Dasar Pemrograman Web HTML

Dokumen ini menjelaskan dasar-dasar pemrograman web menggunakan HTML, termasuk elemen, tag, dan atribut yang membangun struktur halaman web. Terdapat penjelasan tentang berbagai elemen seperti heading, paragraf, gambar, daftar, tautan, tabel, dan video, serta cara penggunaannya. Selain itu, dokumen ini juga mencakup elemen HTML lanjutan dan pentingnya semantik dalam pengembangan web.

Diunggah oleh

edohabun
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
12 tayangan29 halaman

Belajar Dasar Pemrograman Web HTML

Dokumen ini menjelaskan dasar-dasar pemrograman web menggunakan HTML, termasuk elemen, tag, dan atribut yang membangun struktur halaman web. Terdapat penjelasan tentang berbagai elemen seperti heading, paragraf, gambar, daftar, tautan, tabel, dan video, serta cara penggunaannya. Selain itu, dokumen ini juga mencakup elemen HTML lanjutan dan pentingnya semantik dalam pengembangan web.

Diunggah oleh

edohabun
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
Anda di halaman 1/ 29

BELAJAR DASAR PEMROGRAMAN WEB HTML

HTML (Hyper Text Markup Language) adalah bahasa markup yang digunakan untuk

membuat struktur dan menampilkan konten pada halaman web. HTML terdiri dari elemen,

tag, dan atribut yang bekerja bersama untuk membangun halaman web.

Elemen HTML
Elemen HTML adalah komponen dasar yang membangun struktur halaman web. Elemen

biasanya terdiri dari tag pembuka, konten, dan tag penutup.

Contoh:

<p> adalah tag pembuka.

Ini adalah sebuah paragraf. adalah konten.

</p> adalah tag penutup.

Tag HTML
Tag adalah penanda yang digunakan untuk menentukan awal dan akhir dari sebuah elemen.

Tag biasanya ditulis dalam tanda kurung siku (< >). Ada dua jenis tag:

Tag pembuka: Menandai awal elemen, contoh: <p>, <h1>.

Tag penutup: Menandai akhir elemen, contoh: </p>, </h1>.

Beberapa tag tidak memerlukan tag penutup (self-closing tag),

Contoh:

pg. 1
BELAJAR DASAR PEMROGRAMAN WEB HTML

Atribut HTML
Atribut adalah informasi tambahan yang diberikan kepada tag untuk mengontrol perilaku

atau tampilan elemen. Atribut selalu ditulis dalam tag pembuka dan biasanya berbentuk

pasangan nama="nilai".

Contoh:

- href adalah atribut.

- "https://www.example.com" adalah nilai dari atribut href.

Beberapa atribut umum:

- src: Menentukan sumber file (contoh: <img src="gambar.jpg">).

- alt: Menyediakan teks alternatif untuk gambar (<img src="gambar.jpg" alt="Deskripsi

gambar">).

- class: Menentukan kelas untuk styling CSS (<p class="teks-merah">...</p>)

- id: Memberikan identifikasi unik untuk elemen (<div id="header">...</div>).

Contoh Lengkap HTML:

<html>: Elemen root yang membungkus seluruh halaman.

pg. 2
BELAJAR DASAR PEMROGRAMAN WEB HTML

<head>: Berisi metadata seperti judul halaman (<title>).

<body>: Berisi konten yang ditampilkan di halaman web.

<h1>, <p>, <a>, <img>: Contoh elemen dengan tag dan atribut.

Dengan memahami elemen, tag, dan atribut, Anda dapat mulai membangun halaman web

sederhana menggunakan HTML.

Heading
Elemen heading dalam HTML digunakan untuk menentukan judul atau heading pada

halaman web. Heading membantu dalam mengorganisir konten dan memberikan struktur

hierarki pada teks. HTML menyediakan 6 level heading, yaitu <h1> hingga <h6>, di

mana <h1> adalah level tertinggi (paling penting) dan <h6> adalah level terendah (paling

kecil).

Contoh Penggunaan Elemen Heading

Aturan Penggunaan Heading:

1. Hierarki:

o <h1> sebaiknya digunakan untuk judul utama halaman.

o <h2> untuk subjudul.

o <h3> hingga <h6> untuk subbagian yang lebih kecil.

o Jangan melompati level heading (misalnya, langsung

dari <h1> ke <h3> tanpa <h2>).

2. Hanya Satu <h1> per Halaman:

o Biasanya, hanya satu <h1> yang digunakan untuk judul utama halaman.

pg. 3
BELAJAR DASAR PEMROGRAMAN WEB HTML

3. SEO (Search Engine Optimization):

o Heading membantu mesin pencari memahami struktur konten. Gunakan

heading dengan kata kunci yang relevan untuk meningkatkan SEO.

Contoh Penerapan dalam Halaman Web

Hasil Tampilan

1. Heading 1: Judul Utama Halaman

2. Heading 2: Subjudul Pertama

3. Heading 3: Subbagian dari Subjudul Pertama

4. Heading 2: Subjudul Kedua

Catatan

• Heading secara default memiliki ukuran font yang berbeda: <h1> paling besar

dan <h6> paling kecil.

• Anda dapat mengubah tampilan heading menggunakan CSS.

• Heading tidak hanya untuk ukuran teks, tetapi juga untuk memberikan struktur

semantik pada halaman web.

pg. 4
BELAJAR DASAR PEMROGRAMAN WEB HTML

Paragraf
Paragraf dalam HTML dibuat menggunakan tag <p>. Tag ini digunakan untuk mendefinisikan

sebuah paragraf teks. Berikut adalah contoh sederhana penggunaan tag <p>:

Anda juga bisa menambahkan gaya (style) atau kelas (class) ke dalam paragraf

menggunakan CSS untuk mengubah tampilannya sesuai kebutuhan.

Gambar (Image)
Elemen gambar dalam HTML dibuat menggunakan tag <img>. Tag ini digunakan untuk

menampilkan gambar pada halaman web.

Contoh sederhana penggunaan:

Penjelasan:

• src: Atribut ini menentukan sumber (source) gambar, yaitu URL atau path file gambar

yang ingin ditampilkan. Contoh: src="gambar.jpg".

• alt: Atribut ini menyediakan teks alternatif yang akan ditampilkan jika gambar tidak

dapat dimuat. Ini juga berguna untuk aksesibilitas (screen reader) dan SEO.

Contoh: alt="Deskripsi Gambar".

• width: Atribut ini menentukan lebar gambar dalam piksel. Contoh: width="300".

• height: Atribut ini menentukan tinggi gambar dalam piksel. Contoh: height="200".

Contoh Lengkap:

pg. 5
BELAJAR DASAR PEMROGRAMAN WEB HTML

Catatan:

1. Jika gambar tidak ditemukan atau gagal dimuat, teks yang ada di atribut alt akan

ditampilkan.

2. Atribut width dan height bersifat opsional. Jika tidak ditentukan, gambar akan

ditampilkan dalam ukuran aslinya.

3. Pastikan path atau URL gambar (src) benar agar gambar dapat ditampilkan dengan

baik.

Lists HTML (Daftar HTML)


Elemen list (daftar) dalam HTML digunakan untuk menampilkan informasi dalam bentuk

daftar terurut (ordered list) atau daftar tidak terurut (unordered list). Ada tiga jenis list

utama dalam HTML:

Unordered List (Daftar Tidak Terurut)

Menggunakan tag <ul> untuk membuat daftar tidak terurut, dan setiap item dalam

daftar menggunakan tag <li> (list item). Biasanya ditampilkan dengan bullet points.

Contoh:

pg. 6
BELAJAR DASAR PEMROGRAMAN WEB HTML

Contoh Output:

• Item 1

• Item 2

• Item 3

Ordered List (Daftar Terurut)

Menggunakan tag <ol> untuk membuat daftar terurut, dan setiap item dalam daftar juga

menggunakan tag <li>. Biasanya ditampilkan dengan angka atau huruf.

Contoh:

Output:

1. Item Pertama

2. Item Kedua

3. Item Ketiga

Description List (Daftar Deskripsi)

Menggunakan tag <dl> untuk membuat daftar deskripsi. Setiap item terdiri dari istilah

(<dt>) dan deskripsi (<dd>).

Contoh:

pg. 7
BELAJAR DASAR PEMROGRAMAN WEB HTML

Output:

pg. 8
BELAJAR DASAR PEMROGRAMAN WEB HTML

Contoh Lengkap:

Fitur Tambahan:

• Atribut type pada <ol>:

Anda dapat mengubah jenis penomoran pada ordered list menggunakan

atribut type.

pg. 9
BELAJAR DASAR PEMROGRAMAN WEB HTML

Contoh:

Output:

• Atribut start pada <ol>:

Anda dapat menentukan nomor awal untuk ordered list.

Contoh:

Output:

Dengan elemen list, Anda dapat menyusun informasi secara terstruktur dan mudah

dibaca.

pg. 10
BELAJAR DASAR PEMROGRAMAN WEB HTML

Link HTML (Tautan HTML)


Link HTML adalah elemen yang digunakan untuk menghubungkan satu halaman web ke

halaman web lain, atau bahkan ke bagian tertentu dalam halaman yang sama. Di HTML, link

dibuat dengan menggunakan tag <a> (anchor).

Berikut adalah penjelasan lebih lengkap:

<a> : Tag untuk membuat link.


href="URL" : Atribut href yang menunjukkan URL atau alamat tujuan dari link
tersebut.
Teks Link : Teks yang dapat diklik oleh pengguna.

Contoh link:

Link ini akan mengarahkan pengguna ke https://www.example.com ketika mereka


mengklik teks "Kunjungi Example".

Jenis link:

1. Link ke halaman lain:

pg. 11
BELAJAR DASAR PEMROGRAMAN WEB HTML

2. Link ke email:

3. Link ke bagian dalam halaman yang sama:

• Anda membuat sebuah ID pada bagian tertentu halaman:

• Lalu, link ke bagian tersebut:

pg. 12
BELAJAR DASAR PEMROGRAMAN WEB HTML

Table HTML (Tabel)


Elemen tabel dalam HTML digunakan untuk menampilkan data dalam bentuk baris dan

kolom. Tabel dibuat menggunakan tag <table>, dan terdiri dari beberapa elemen utama:

• <table>: Tag utama untuk membuat tabel.

• <tr>: Tag untuk membuat baris (table row).

• <th>: Tag untuk membuat header kolom (table header). Biasanya teks

dalam <th> ditampilkan tebal dan di tengah.

• <td>: Tag untuk membuat sel data (table data). Ini adalah konten utama tabel.

Struktur Dasar Tabel HTML

Fitur Lanjutan Tabel HTML

Menggabungkan Sel (Colspan dan Rowspan):

• colspan: Menggabungkan beberapa kolom.

• rowspan: Menggabungkan beberapa baris.

pg. 13
BELAJAR DASAR PEMROGRAMAN WEB HTML

Contoh:

Menambahkan Caption:

Gunakan tag <caption> untuk menambahkan judul tabel.

Contoh:

Mengelompokkan Header, Body, dan Footer:

• <thead>: Untuk mengelompokkan header tabel.

• <tbody>: Untuk mengelompokkan body tabel.

• <tfoot>: Untuk mengelompokkan footer tabel.

pg. 14
BELAJAR DASAR PEMROGRAMAN WEB HTML

Contoh:

Styling dengan CSS:

Anda dapat menambahkan gaya seperti border, padding, dan warna menggunakan CSS.

Contoh:

pg. 15
BELAJAR DASAR PEMROGRAMAN WEB HTML

Contoh Tabel dengan Fitur Lengkap:

pg. 16
BELAJAR DASAR PEMROGRAMAN WEB HTML

Video HTML
Elemen video dalam HTML memungkinkan Anda untuk menampilkan dan memutar video

langsung di halaman web. Elemen ini dibuat menggunakan tag <video>. Berikut adalah

penjelasan lengkap tentang cara menggunakan elemen video HTML:

Struktur Dasar Elemen Video:

Penjelasan:

1. Tag <video>: Tag utama untuk menampilkan video.


2. Atribut controls: Menambahkan kontrol pemutaran video seperti play, pause,
volume, dan fullscreen.
3. Tag <source>: Digunakan untuk menentukan sumber video dan formatnya. Anda
dapat menyediakan beberapa format video untuk kompatibilitas browser.
4. Pesan Fallback: Teks di dalam tag <video> akan ditampilkan jika browser tidak
mendukung elemen video.

Atribut Penting pada Elemen Video:

• src: Menentukan URL atau path file video.


• type: Menentukan format video (misalnya, video/mp4, video/webm, video/ogg).
• width dan height: Menentukan ukuran video.
• autoplay: Video akan mulai diputar secara otomatis setelah halaman dimuat.
• loop: Video akan diputar berulang-ulang.
• muted: Video akan dimulai dalam keadaan mute (tanpa suara).
• poster: Menentukan gambar thumbnail yang ditampilkan sebelum video diputar.

pg. 17
BELAJAR DASAR PEMROGRAMAN WEB HTML

Contoh:

Penjelasan:

1. controls: Menambahkan kontrol pemutaran video.


2. width="600": Menentukan lebar video menjadi 600 piksel.
3. poster="thumbnail.jpg": Menampilkan gambar thumbnail sebelum video diputar.
4. Beberapa Format Video: Menyediakan beberapa format video (mp4, webm, ogg)
untuk kompatibilitas browser.

Fitur Lanjutan:

1. Autoplay dan Muted:


Video dapat diputar otomatis dengan atribut autoplay, tetapi kebanyakan browser
memerlukan atribut muted untuk mengizinkan autoplay.

pg. 18
BELAJAR DASAR PEMROGRAMAN WEB HTML

2. Loop:
Video akan diputar berulang-ulang.

3. Preload:
Atribut preload menentukan apakah video harus diunduh saat halaman dimuat.
Nilainya bisa:
• auto: Browser mengunduh video secara otomatis.
• metadata: Hanya metadata video yang diunduh.
• none: Video tidak diunduh sampai pengguna memutarnya.

Subtitel:
Anda dapat menambahkan subtitel menggunakan tag <track>.

pg. 19
BELAJAR DASAR PEMROGRAMAN WEB HTML

Contoh dengan Fitur Lengkap:

Catatan:

• Pastikan file video dan subtitel (jika ada) berada di direktori yang benar atau URL yang
valid.
• Format video yang didukung oleh browser berbeda-beda. Sediakan beberapa format
untuk kompatibilitas yang lebih baik.

Dengan elemen video HTML, Anda dapat menampilkan konten multimedia secara interaktif
di halaman web Anda.

pg. 20
BELAJAR DASAR PEMROGRAMAN WEB HTML

Elemen HTML Lanjutan

Elemen HTML adalah komponen dasar yang membangun struktur dan konten sebuah
halaman web. Setiap elemen HTML terdiri dari tag pembuka, konten, dan tag penutup
(kecuali untuk elemen void seperti <img> atau <br>). Elemen-elemen ini digunakan untuk
mendefinisikan bagian-bagian dari halaman web, seperti teks, gambar, tabel, formulir, dan
lainnya.

Struktur Dasar Elemen HTML:

html

<tag_pembuka>Konten</tag_penutup>

Run HTML

Contoh:

html

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

Run HTML

Jenis-Jenis Elemen HTML:

1. Elemen Blok (Block Elements):


Elemen blok menempati seluruh lebar parent-nya dan selalu dimulai pada baris baru.
Contoh:
o <div>: Kontainer blok untuk mengelompokkan elemen.
o <p>: Paragraf.
o <h1> sampai <h6>: Heading (judul).
o <ul>, <ol>, <li>: Daftar (list).
o <table>, <tr>, <td>: Tabel.

pg. 21
BELAJAR DASAR PEMROGRAMAN WEB HTML

Contoh:

html

<div>
<h1>Judul</h1>
<p>Ini adalah paragraf.</p>
</div>

Run HTML

2. Elemen Inline (Inline Elements):


Elemen inline hanya menempati ruang sesuai dengan kontennya dan tidak memulai
baris baru. Contoh:
o <span> : Kontainer inline untuk mengelompokkan teks.
o <a> : Link.
o <strong> : Teks tebal (bold).
o <em> : Teks miring (italic).
o <img> : Gambar.

Contoh:
html

<p>Ini adalah <strong>teks tebal</strong> dan <em>teks miring</em>.</p>

Run HTML

3. Elemen Void (Self-Closing Elements):


Elemen void tidak memiliki tag penutup dan tidak mengandung konten. Contoh:
o <img> : Menampilkan gambar.
o <br> : Baris baru.
o <hr> : Garis horizontal.
o <input> : Input form.

Contoh:
html

<img src="gambar.jpg" alt="Deskripsi Gambar">

pg. 22
BELAJAR DASAR PEMROGRAMAN WEB HTML

Run HTML

4. Elemen Semantik:
Elemen semantik memberikan makna pada kontennya, sehingga lebih mudah
dipahami oleh mesin pencari dan developer. Contoh:
o <header> : Bagian kepala halaman.
o <footer> : Bagian kaki halaman.
o <nav> : Navigasi.
o <section> : Bagian dari halaman.
o <article> : Konten artikel.
o <aside> : Konten samping (sidebar).

Contoh:
html

<header>
<h1>Judul Website</h1>
<nav>
<a href=”#”>Beranda</a>
<a href=”#”>Tentang</a>
</nav>
</header>
Run HTML

5. Elemen Formulir:
Digunakan untuk membuat form interaktif. Contoh:
o <form> : Kontainer untuk form.
o <input> : Input field.
o <textarea> : Area teks.
o <button> : Tombol.
o <select> dan <option>: Dropdown menu.

Contoh:
html

<form>
<label for=”nama”>Nama:</label>
<input type=”text” id=”nama” name=”nama”>
<button type=”submit”>Kirim</button>
</form>
Run HTML

pg. 23
BELAJAR DASAR PEMROGRAMAN WEB HTML

Contoh Halaman HTML dengan Berbagai Elemen:

html

<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Contoh Halaman HTML</title>
</head>
<body>
<header>
<h1>Selamat Datang di Website Saya</h1>
<nav>
<a href="#beranda">Beranda</a> |
<a href="#tentang">Tentang</a> |
<a href="#kontak">Kontak</a>
</nav>
</header>

<section id="beranda">
<h2>Beranda</h2>
<p>Ini adalah halaman beranda.</p>
<img src="gambar.jpg" alt="Gambar Beranda" width="300">
</section>

<section id="tentang">
<h2>Tentang</h2>
<p>Ini adalah halaman tentang kami.</p>
<ul>
<li>Sejarah</li>
<li>Visi dan Misi</li>
</ul>
</section>

<section id="kontak">
<h2>Kontak</h2>
<form>
<label for="nama">Nama:</label>
<input type="text" id="nama" name="nama"><br><br>

pg. 24
BELAJAR DASAR PEMROGRAMAN WEB HTML

<label for="email">Email:</label>
<input type="email" id="email" name="email"><br><br>
<label for="pesan">Pesan:</label>
<textarea id="pesan" name="pesan"></textarea><br><br>
<button type="submit">Kirim</button>
</form>
</section>

<footer>
<p>&copy; 2023 Website Saya. Semua hak dilindungi.</p>
</footer>
</body>
</html>

Run HTML

Kesimpulan:

Elemen HTML adalah blok bangunan dasar dari sebuah halaman web. Dengan
menggabungkan berbagai elemen seperti teks, gambar, tabel, formulir, dan elemen
semantik, Anda dapat membuat halaman web yang terstruktur, interaktif, dan mudah
dipahami.

pg. 25
BELAJAR DASAR PEMROGRAMAN WEB HTML

ATRIBUT HTML

HTML (HyperText Markup Language) memiliki banyak atribut yang digunakan untuk
memberikan informasi tambahan pada elemen HTML. Berikut adalah beberapa
atribut HTML beserta kegunaan dan contohnya:

1. id
o Kegunaan: Memberikan identifikasi unik untuk sebuah elemen.
o Contoh: <div id="header">Ini adalah header</div>
2. class
o Kegunaan: Menentukan satu atau lebih kelas CSS untuk elemen.
o Contoh: <p class="text-center">Teks ini berada di tengah</p>
3. style
o Kegunaan: Menambahkan gaya CSS langsung ke elemen.
o Contoh: <p style="color:red;">Teks ini berwarna merah</p>
4. src
o Kegunaan: Menentukan sumber file untuk elemen seperti gambar,
script, atau iframe.
o Contoh: <img src="gambar.jpg" alt="Deskripsi gambar">
5. href
o Kegunaan: Menentukan URL tujuan untuk elemen seperti link.
o Contoh: <a href="https://example.com">Kunjungi Contoh</a>
6. alt
o Kegunaan: Menyediakan teks alternatif untuk gambar jika gambar
tidak dapat ditampilkan.
o Contoh: <img src="gambar.jpg" alt="Deskripsi gambar">
7. title
Kegunaan: Menambahkan informasi tambahan tentang elemen,
o
biasanya ditampilkan sebagai tooltip.
o Contoh: <a href="https://example.com" title="Kunjungi
Contoh">Contoh</a>
8. width dan height
Kegunaan: Menentukan lebar dan tinggi elemen seperti gambar atau
o
iframe.
o Contoh: <img src="gambar.jpg" width="300" height="200">
9. disabled
o Kegunaan: Menonaktifkan elemen seperti input atau button.
o Contoh: <input type="text" disabled>

pg. 26
BELAJAR DASAR PEMROGRAMAN WEB HTML

10. readonly
o Kegunaan: Membuat elemen input hanya dapat dibaca, tidak dapat
diubah.
o Contoh: <input type="text" readonly value="Tidak dapat diubah">
11. value
Kegunaan: Menentukan nilai awal untuk elemen input.
o
o Contoh: <input type="text" value="Nilai awal">
12. placeholder
Kegunaan: Menampilkan teks sementara di dalam elemen input
o
sebelum pengguna memasukkan nilai.
o Contoh: <input type="text" placeholder="Masukkan nama Anda">
13. required
o Kegunaan: Menentukan bahwa elemen input harus diisi sebelum
formulir dapat dikirim.
o Contoh: <input type="text" required>
14. type
o Kegunaan: Menentukan jenis elemen input.
o Contoh: <input type="email" name="email">
15. name
Kegunaan: Menentukan nama elemen, biasanya digunakan dalam
o
formulir untuk mengidentifikasi data yang dikirim.
o Contoh: <input type="text" name="username">
16. target
o Kegunaan: Menentukan di mana dokumen yang ditautkan akan
dibuka.
o Contoh: <a href="https://example.com" target="_blank">Buka di tab
baru</a>
17. rel
Kegunaan: Menentukan hubungan antara dokumen saat ini dan
o
dokumen yang ditautkan.
o Contoh: <a href="https://example.com" rel="nofollow">Tautan
nofollow</a>
18. colspan dan rowspan
o Kegunaan: Menentukan berapa banyak kolom atau baris yang harus
digabungkan dalam tabel.
o Contoh: <td colspan="2">Menggabungkan dua kolom</td>
19. lang

pg. 27
BELAJAR DASAR PEMROGRAMAN WEB HTML

o Kegunaan: Menentukan bahasa dari konten elemen.


o Contoh: <p lang="en">This is in English</p>
20. data-*
o Kegunaan: Menyimpan data khusus pada elemen yang dapat
digunakan oleh JavaScript.
o Contoh: <div data-user-id="12345"></div>
21. aria-*
o Kegunaan: Menyediakan informasi aksesibilitas untuk elemen.
o Contoh: <button aria-label="Close">X</button>
22. autofocus
o Kegunaan: Secara otomatis memfokuskan elemen input saat halaman
dimuat.
o Contoh: <input type="text" autofocus>
23. checked
o Kegunaan: Menentukan bahwa elemen input seperti checkbox atau
radio button harus dicentang secara default.
o Contoh: <input type="checkbox" checked>
24. multiple
o Kegunaan: Memungkinkan pengguna untuk memilih lebih dari satu
nilai dalam elemen input.
o Contoh: <input type="file" multiple>
25. maxlength
o Kegunaan: Menentukan jumlah maksimum karakter yang dapat
dimasukkan dalam elemen input.
o Contoh: <input type="text" maxlength="10">
26. min dan max
o Kegunaan: Menentukan nilai minimum dan maksimum untuk elemen
input seperti number atau date.
o Contoh: <input type="number" min="1" max="10">
27. pattern
o Kegunaan: Menentukan pola regex yang harus dipenuhi oleh nilai
elemen input.
o Contoh: <input type="text" pattern="[A-Za-z]{3}">
28. selected
o Kegunaan: Menentukan bahwa opsi dalam elemen select harus dipilih
secara default.

pg. 28
BELAJAR DASAR PEMROGRAMAN WEB HTML

o Contoh: <select><option value="1">Satu</option><option value="2"


selected>Dua</option></select>
29. size
o Kegunaan: Menentukan jumlah karakter yang terlihat dalam elemen
input.
o Contoh: <input type="text" size="20">
30. step
o Kegunaan: Menentukan interval nilai yang valid untuk elemen input
seperti number atau date.
o Contoh: <input type="number" step="2">

pg. 29

Anda mungkin juga menyukai