Contoh Penggunaan Link pada HTML

Contoh Penggunaan Link pada HTML

Berikut ini adalah beberapa contoh penggunaan link pada HTML beserta penjelasan lengkap pada setiap kode yang digunakan.

1. Membuat Tautan

HTML
<a href="https://www.example.com">Ini adalah tautan</a>
HTML

2. Memanggil Gambar

HTML
<img src="gambar.jpg" alt="Ini adalah gambar">
HTML

3. Membuat Daftar

HTML
<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>
HTML

4. Membuat Tabel

HTML
<table>
  <tr>
    <th>Nama</th>
    <th>Usia</th>
  </tr>
  <tr>
    <td>John Doe</td>
    <td>25</td>
  </tr>
  <tr>
    <td>Jane Smith</td>
    <td>30</td>
  </tr>
</table>
HTML

5. Membuat Formulir

HTML
<form>
  <label for="nama">Nama:</label>
  <input type="text" id="nama" name="nama"><br><br>
  <label for="email">Email:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="Submit">
</form>
HTML

6. Memuat Vidio

HTML
<video controls>
  <source src="video.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>
HTML

7. Memuat Audio

HTML
<audio controls>
  <source src="audio.mp3" type="audio/mpeg">
  Your browser does not support the audio tag.
</audio>
HTML

8. Membuat komponen semantik

HTML
<header>
  <h1>Ini adalah judul halaman</h1>
</header>

<nav>
  <ul>
    <li><a href="#">Beranda</a></li>
    <li><a href="#">Tentang</a></li>
    <li><a href="#">Kontak</a></li>
  </ul>
</nav>

<main>
  <h2>Ini adalah konten utama</h2>
  <p>Ini adalah paragraf dalam konten utama.</p>
</main>

<footer>
  <p>Hak Cipta © 2022</p>
</footer>
HTML

Output:

See the Pen Membuat komponen semantik by De Orchids (@De-Orchids) on CodePen.

Silakan gunakan contoh-contoh di atas sebagai referensi untuk membuat kode HTML yang sesuai dengan kebutuhan Anda.

Leave a Reply

Your email address will not be published. Required fields are marked *