Penulis 
HyperText Markup Language, atau yang lebih populer disebut HTML, adalah bahasa markup yang digunakan untuk menyusun struktur halaman web. Anda bisa mengatur teks, menambahkan gambar dan link, hingga membuat formulir.
Meskipun membutuhkan coding, HTML sebenarnya mudah dipelajari karena bukan merupakan bahasa pemrograman. Tag-tag HTML juga cukup jelas, karena memiliki struktur yang sederhana dan teratur.
Kalau Anda tertarik untuk belajar HTML, kami akan memandu Anda melalui artikel ini. Kami punya banyak contoh HTML untuk berbagai tujuan, mulai dari fungsi dasar hingga pembuatan halaman web. Sudah siap? Mari mulai!
1. Struktur Dasar HTML
2. Heading dan Paragraf
3. Memformat Teks dengan Bold, Italic, Underline
4. Memasukkan Gambar di Halaman Web
5. Menambahkan Link dalam Teks
6. Mencantumkan Daftar dengan Bullet Poin
7. Mebuat Daftar Berurutan
8. Membuat Tabel dengan Baris dan Kolom
9. Membuat Formulir Sederhana
10. Menambahkan Daftar Dropdown
11. Membuat Kotak Centang
12. Menambahkan Radio Button
13. Memasukkan Video dan Audio
14. Mengubah Warna Teks
15. Mengganti Font Teks
16. Menyorot Teks dengan Warna
17. Mengubah Ukuran Teks
18. Mengatur Perataan Teks
19. Mencoret Sebagian Teks
20. Membuat Kutipan
21. Menambahkan Tooltip
22. Menambahkan Kolom Tanggal
23. Menampilkan Teks Superscript dan Subscript
2. Heading dan Paragraf
3. Memformat Teks dengan Bold, Italic, Underline
4. Memasukkan Gambar di Halaman Web
5. Menambahkan Link dalam Teks
6. Mencantumkan Daftar dengan Bullet Poin
7. Mebuat Daftar Berurutan
8. Membuat Tabel dengan Baris dan Kolom
9. Membuat Formulir Sederhana
10. Menambahkan Daftar Dropdown
11. Membuat Kotak Centang
12. Menambahkan Radio Button
13. Memasukkan Video dan Audio
14. Mengubah Warna Teks
15. Mengganti Font Teks
16. Menyorot Teks dengan Warna
17. Mengubah Ukuran Teks
18. Mengatur Perataan Teks
19. Mencoret Sebagian Teks
20. Membuat Kutipan
21. Menambahkan Tooltip
22. Menambahkan Kolom Tanggal
23. Menampilkan Teks Superscript dan Subscript
<html>
<head>
<title>Contoh Struktur Dasar HTML</title>
</head>
<body>
<p>Halo, dunia!</p>
<h1>Judul Utama (H1) di Bagian Ini</h1>
<h2>Sub Judul (H2) Ada di Sini </h2>
<p>Bagian ini berisi teks paragraf yang bisa Anda isi dengan konten tulisan.</p>
<p>Baris ini memiliki <strong>kata-kata yang diformat tebal dengan tag strong</strong>.</p>
<p>Sementara itu, kata-kata di baris ini <em>diformat dengan tag em</em> agar miring.</p>
<p>Di baris ini, <u>ada teks yang diformat underline</u> untuk menambahkan garis bawah.</p>
<img src="gambar-pemandangan.jpg" alt="Pemandangan Indah di Pegunungan" width="300" height="200">
<p>Dalam contoh ini, kami menambahkan <a href="https://www.example.com" target="_blank">link dalam teks</a> yang bisa diklik dan mengarah ke halaman lain.</p>
<ul>
<li>ni adalah poin pertama dalam daftar.</li>
<li>ni adalah poin kedua dalam daftar.</li>
<li>ni adalah poin ketiga dalam daftar.</li>
</ul>
<ol>
<li>Pertama, buka hPanel dan pilih menu website.</li>
<li>Klik tombol <strong>Dashboard</strong> di samping website Anda.</li>
<li>Di bagian dashboard, temukan dan pilih <strong>File Manager</strong>.</li>
</ol>
<table border="1">
<tr>
<th>Nama</th>
<th>Usia</th>
<th>Asal</th>
</tr>
<tr>
<td>Agus</td>
<td>20</td>
<td>Yogyakarta</td>
</tr>
<tr>
<td>Budi</td>
<td>25</td>
<td>Jakarta</td>
</tr>
<tr>
<td>Cantika</td>
<td>20</td>
<td>Purwokerto</td>
</tr>
</table>
<form action="/submit">
<label for="name">Nama Pengguna:</label>
<input type="text" id="name" name="name">
<br>
<label for="email">Kata Sandi:</label>
<input type="email" id="email" name="email">
<br>
<input type="submit" value="Login">
</form>
<label for="kota">Pilih Kota:</label>
<select id="kota" name="kota">
<option value="yogyakarta">Yogyakarta</option>
<option value="jakarta">Jakarta</option>
<option value="purwokerto">Purwokerto</option>
</select>
<p>Pilih hobi Anda:</p>
<input type="checkbox" id="membaca" name="hobi" value="membaca">
<label for="membaca">Main Game</label><br>
<input type="checkbox" id="berkebun" name="hobi" value="berkebun">
<label for="berkebun">Menulis</label><br>
<input type="checkbox" id="menulis" name="hobi" value="menulis">
<label for="menulis">Menonton Film</label>
<p>Pilih jenis kelamin:</p>
<input type="radio" id="laki-laki" name="gender" value="laki-laki">
<label for="laki-laki">Laki-laki</label><br>
<input type="radio" id="perempuan" name="gender" value="perempuan">
<label for="perempuan">Perempuan</label>
</body>
</html>
EmoticonEmoticon