Ses ve video
<audio> ve <video> etiketleriyle medya eklemeyi öğrenirsin.
audio öğesi
<audio> öğesi sayfaya ses ekler: müzik parçası, podcast bölümü, sesli mesaj. src özniteliği ses dosyasının adresini taşır, tıpkı img'deki gibi.
controls özniteliğini eklemezsen tarayıcı ses oynatıcısını sayfada hiç göstermez; ses dosyası yüklenir ama kullanıcı oynatacak düğme bulamaz. controls ekleyince oynat, duraklat ve ses düzeyi düğmeleri görünür: <audio src="..." controls></audio>. audio bir kapanış etiketi ister; içine ek içerik de koyulabilir.
video öğesi
<video> öğesi sayfaya video ekler. Kullanımı audio'ya çok benzer: src ile adres, controls ile oynat düğmeleri. <video src="..." controls></video> şeklinde yazılır.
video için controls neredeyse zorunludur; olmadan kullanıcı videoyu başlatamaz. Ek olarak poster özniteliğiyle video başlamadan önce gösterilecek bir görsel de belirtebilirsin, ama temel kullanım src ve controls ile başlar.
Uygulama Kontrollü video ekle
Body içine bir <video> öğesi ekle. src özniteliğine gerçekçi bir video adresi ve controls özniteliğini yaz. Kapanış etiketini unutma.
Örnek çözümü göster
<body>
<video src="https://example.com/belgesel/kuslar.mp4" controls></video>
</body>Kendini test et
-
controls özniteliği ne yapar?
- Görselin boyutunu sabitler
- Videoyu otomatik başlatır
- Alternatif metni gösterir
- Oynat, duraklat ve ses düğmelerini gösterir
Cevabı göster
Oynat, duraklat ve ses düğmelerini gösterir — Doğru. controls, oynat-duraklat ve ses düğmelerini sayfada gösterir.
-
video'ya controls ekle
<video src="https://example.com/belgesel/kuslar.mp4" ____></video>Cevabı göster
<video src="https://example.com/belgesel/kuslar.mp4" controls></video> -
Medya öğelerini eşleştir
- audio
- Ses çalar
- video
- Video oynatır
- img
- Görsel yükler
- controls
- Oynat düğmelerini gösterir