HTML Dasar | #6 Gambar Dan Media

Gambar dan Media

Menambahkan Gambar dengan Tag <img>

Untuk menampilkan gambar di halaman web, Anda dapat menggunakan tag <img>. Tag ini memerlukan atribut src untuk menentukan URL gambar, serta atribut alt untuk deskripsi alternatif jika gambar tidak dapat ditampilkan.

Contoh Penggunaan Tag <img>:

<img src="https://example.com/image.jpg" alt="Deskripsi Gambar">

        

Di atas, gambar akan dimuat dari URL yang ditentukan dan jika gambar tidak tersedia, teks alternatif "Deskripsi Gambar" akan ditampilkan.

Menggunakan Video dengan Tag <video>

Anda juga dapat menambahkan video ke halaman web menggunakan tag <video>. Tag ini mendukung berbagai atribut seperti controls untuk menampilkan kontrol video (play, pause, volume), dan autoplay untuk memulai video secara otomatis ketika halaman dimuat.

Contoh Penggunaan Tag <video>:

<video width="320" height="240" controls>
    <source src="video.mp4" type="video/mp4">
    Browser Anda tidak mendukung elemen video.
</video>

        

Contoh di atas menambahkan video dengan kontrol dasar, dan jika browser tidak mendukung elemen video, pesan fallback akan ditampilkan.

Menggunakan Audio dengan Tag <audio>

Untuk menambahkan audio, Anda bisa menggunakan tag <audio>. Tag ini juga mendukung atribut seperti controls untuk menampilkan kontrol audio (play, pause, volume), dan autoplay untuk memulai pemutaran secara otomatis.

Contoh Penggunaan Tag <audio>:

<audio controls>
    <source src="audio.mp3" type="audio/mpeg">
    Browser Anda tidak mendukung elemen audio.
</audio>

        

Di sini, audio akan ditampilkan dengan kontrol dasar dan teks fallback jika elemen audio tidak didukung oleh browser.