Daha önce öğrenirken görmediğiniz, belki de varlığından haberdar olmadığınız HTML etiketlerini sizler için derledik. İsterseniz daha fazla uzatmadan hemen başlayalım!
1. <noscript> Etiketi-
Bu etiket, javascript kodları devre dışı kaldığında ilgili kişilere bilgi verilmesi amacıyla kullanılmaktadır. Örneğin sayfada önemli bir script kodu devre dışı olduğu zaman ekrana bilgi mesajı gönderir.
Kod:
<noscript><h1>script kodları devre dışıdır.</h1></noscript>Çıktı:
script kodları devre dışıdır.
2. <meter> Etiketi-
Bu etiket ise html ‘de, nesnelerin veya verilerin ölçüm detaylarını göstermek için kullanılır. Örneğin Javascript yeteneğine 10 üzerinden 7 vermek için bu etiket kullanılabilir. Progress bar mantığıyla çalışan bu etiket, kullanıldığında gayet güzel görüntüler elde etmeniz için olmazsa olmazdır.
Kod:
2
<meter value="7" min="0" max="10">10 üzerinden 7</meter>
<meter value="0.4">40%</meter>Çıktı:
3. <detail> Etiketi-
Bu etiket de yine diğerleri gibi özel bir kullanıma sahiptir. Gizlemek istediğiniz veya isteğe göre açılabilen alanlar oluşturmanızı sağlar. Ayrıca etiketin içine ekleyeceğiniz <summary> etiketi ile kullanıcıya bilgi verebilirsiniz. Örneğin “tıklayıp görebilirsiniz” gibi. Hadi nasıl yapabileceğimizi aşağıdan inceleyelim!
Kod:
<details>
<summary>Tıkla</summary>
Burası tıklanınca görüntülenecek olan içeriktir.
</details>4. <audio> Etiketi-
Bu etiket vasıtasıyla kolay bir şekilde html sayfanıza ses dosyası bağlayabilirsiniz! Üstelik kullanıcılara bazı yetkiler vermek için “controls” özelliğini kullanabilirsiniz. Bu özelliklere örnek olarak. çalma, duraklatma, kapatma, ses ayarlama vb. örnekler verilebilmektedir. O hâlde haydi aşağıdan örneğimizi inceleyelim!
Kod:
<audio controls>
<source src="music.mp4" type="audio/mp4">
<source src="music.mp3" type="audio/mp3">
</audio>5. <datalist> Etiketi-
Web sayfasında bulunana arama çubuklarına yazılan metinlerin önceden tanımlanmış olan ifadelerle tamamlanmasını sağlayan etiket. Kullanıcılar arama yapmak için bir değer girdiğinde bu değer önceden tanımlanmış olan ifade ile tamamlanabilir. Örneğin “y” harfi girildiğinde önceden tanımlanmış olan “yazılım”, “yeni diller” ve “yazılım dilleri” ifadeleri çıkması. Öyleyse gelin hep beraber aşağıdaki örneği inceleyelim!
Kod:
<input type="text" list="days" placeholder="En sevdiğiniz programlama dili">
<datalist id="days">
<option value="JavaScript"></option>
<option value="Python"></option>
<option value="MySQL"></option>
<option value="PHP"></option>
<option value="C++"></option>
<option value="Java"></option>
<option value="Swift"></option>
</datalist>
