HTML Sayfasına Müzik Dosyası Ekleme

1
1223
görüntülenme

Merhaba, HTML Sayfasına Müzik Dosyası Ekleme başlıklı yazıma hoşgeldiniz bu yazımda HTML dosyasına Müzik nasıl eklenir bu konuya değineceğim. Öyleyse hemen başlayalım.

Müzik dosyası eklemek için audio etiketleri içinde source etiketini kullanacağız.

En basit hale müzik eklemek için;

<audio autoplay="">
 <source src="ses.mp3" type="audio/mpeg">
</audio>

Oynatma araçları eklemeden ses sadece arkaplanda çalıyormuş gibi gözükür bunun önüne geçmek için oynatma araçlarını eklememiz lazım.

Oynatma araçlarıyla müzik eklemek için;


<audio controls="">
<source src="ses.mp3" type="audio/mpeg">
</audio>

Çıktı;

HTML Sayfasına Müzik Dosyası Ekleme Resim 2

Gördüğünüz gibi oynatma araçlarını göstermek için audio etiketi içine controls methodu ekledik.

Hem oynatma araçlarıyla hem de otomatik çalma özelliğiyle müzik eklemek için;


<audio controls="" autoplay="">
<source src="ses.mp3" type="audio/mpeg">
</audio>

Çıktı;

HTML Sayfasına Müzik Dosyası Ekleme Resim 2

Gördüğünüz gibi kodumuza bir de autoplay methodunu ekledik.

Oynatma araçları ve otomatik oynatma methoduyla bir de tekrarlama özelliği eklemek için;


<audio controls="" autoplay="" loop="">
<source src="ses.mp3" type="audio/mpeg">
</audio>

Gördüğünüz gibi kodumuza ayriyeten loop methodu ekledik bu methodlar birlikte müzik bitince tekrar baştan başlayacaktır.. Birde sesi kapatmak için muted methodu da ekleyebilirsiniz.

Bu yazımın da sonuna geldik başka bir yazıda görüşmek üzere sağlıcakla kalın.

Önceki İçerikHTML Sayfasına Video Nasıl Eklenir?
Sonraki İçerikOnline Html Kod Editörleri
Merhaba bu alanda kısaca kendimden bahsedeceğim. Adım Tuğra, 19 yaşındayım. Ticaret lisesi mezunuyum şuan Afyon Kocatepe Üniversitesinde İşletme bölümü okuyorum. Aslen Konyalıyım Afyonkarahisar'da ailemle birlikte yaşıyorum. Yaklaşık 11 senedir bilgisayarlarla içli dışlıyım son 6 senedir kendimi internete 2 yıldır ise Web Programlamaya verdim ileri derece PHP ve HTML biliyorum CSS Javascript Jquery için kendimi geliştirmeye devam ediyorum.. Yakında yayına çıkaracağım yyazilim.com için projeler geliştiriyorum. İş çözümleriniz için mail (iletisim@tugrayaldiz.com) atabilirsiniz. Şimdilik benden bu kadar eğer sende aramıza gelmek istersen mail listemize katılman yeterli kendine iyi bak. :) Not: Web programlama dersleri için https://www.w3schools.com adresini kaynak alıyorum.
Paylaş

1 YORUM

CEVAP VER

Lütfen yorum alanını boş bırakma.
Lütfen adını gir.

This site uses Akismet to reduce spam. Learn how your comment data is processed.