1. File: latihan_1.html
“Membuat file HTML pertama untuk website”
<!DOCTYPE html>
<html lang="id">
<head>
<title>Latihan HTML</title>
</head>
<body>
<h1>Ini adalah judul halaman web</h1>
<p>Ini adalah paragraf pertama.</p>
<p>Ini adalah paragraf kedua.</p>
</body>
</html>
Keterangan:
• Tag <!DOCTYPE html> digunakan untuk memberitahu browser bahwa file yang akan dibuka
adalah file HTML.
• Tag <html lang="id"> digunakan untuk menentukan bahasa yang digunakan dalam halaman
web.
• Tag <head> digunakan untuk menyimpan informasi tentang halaman web, seperti judul, meta
tag, dan gaya CSS.
• Tag <title> digunakan untuk menentukan judul halaman web.
• Tag <body> digunakan untuk menyimpan konten halaman web.
• Tag <h1> digunakan untuk membuat judul dengan ukuran besar.
• Tag <p> digunakan untuk membuat paragraf.
2. File: latihan_2.html
“Membuat table dengan tag <table> “
<!DOCTYPE html>
<html lang="id">
<head>
<title>Latihan HTML</title>
</head>
<body>
<table>
<tr>
<th>Nomor</th>
<th>Nama</th>
<th>Umur</th>
</tr>
<tr>
<td>1</td>
<td>John Doe</td>
<td>25</td>
</tr>
<tr>
<td>2</td>
<td>Jane Doe</td>
<td>23</td>
</tr>
</table>
</body>
</html>
Keterangan:
• Tag <table> digunakan untuk membuat tabel.
• Tag <tr> digunakan untuk membuat baris dalam tabel.
• Tag <th> digunakan untuk membuat kolom judul dalam tabel.
• Tag <td> digunakan untuk membuat kolom data dalam tabel.
untuk menampilkan garis table ubahlah <table> menjadi <table border=”1”>
3. File: Latihan_3.html
“Membuat daftar list tidak berurutan pakai symbol titik sepeti keterangan … “
<!DOCTYPE html>
<html lang="id">
<head>
<title>Latihan HTML</title>
</head>
<body>
<ul>
<li>Daftar item 1</li>
<li>Daftar item 2</li>
<li>Daftar item 3</li>
</ul>
</body>
</html>
Keterangan:
• Tag <ul> digunakan untuk membuat daftar tidak berurutan.
• Tag <li> digunakan untuk membuat item dalam daftar.
“Membuat daftar list berurutan 1, 2, 3, 4, dst… “
<!DOCTYPE html>
<html lang="id">
<head>
<title>Latihan HTML</title>
</head>
<body>
<ol>
<li>Daftar item A</li>
<li>Daftar item B</li>
<li>Daftar item C</li>
</ol>
</body>
</html>
Keterangan:
• Tag <ol> digunakan untuk membuat daftar berurutan ( 1, 2, 3, 4, ..dst..).
• Tag <li> digunakan untuk membuat item dalam daftar.
4. File: Latihan_4.html
“memasukan gambar ke dalam HTML (lokasi gambar harus dalam 1 folder dengan file
Latihan_4.html”
<!DOCTYPE html>
<html lang="id">
<head>
<title>Latihan HTML</title>
</head>
<body>
<img src="gambar.jpg" alt="Gambar">
</body>
</html>
Keterangan:
• Tag <img> digunakan untuk membuat gambar.
• Atribut src digunakan untuk menentukan alamat/lokasi gambar berada.
• Atribut alt digunakan untuk memberikan keterangan gambar.
“memasukan gambar ke dalam HTML dengan menggunakan Alamat link http:// atau www.”
<!DOCTYPE html>
<html lang="id">
<head>
<title>Latihan HTML</title>
</head>
<body>
<img
src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_
color_272x92dp.png"
alt="Gambar" >
</body>
</html>
Keterangan:
• Harus terkoneksi kedalam jaringan internet untuk memunculkan gambar
• Tag <img> digunakan untuk membuat gambar.
• Atribut src digunakan untuk menentukan alamat/lokasi gambar berada.
• Atribut alt digunakan untuk memberikan keterangan gambar.
5. File: Latihan_5.html
“membuat link pada HTML yang dapat berguna untuk berpindah halaman/file dari file 1 ke file 2 atau
halaman A ke halaman B”
<!DOCTYPE html>
<html lang="id">
<head>
<title>Latihan HTML</title>
</head>
<body>
<a href="https://www.google.com">Google</a>
</body>
</html>
Keterangan:
• Tag <a> digunakan untuk membuat link.
• Atribut href digunakan untuk menentukan alamat link.
