HTML-5 CSS-3 DERS 2 html5 Yapısal Etiketler ve Header Kullanımı
HTML5 Te <header> etiketinin kullanılışı, aldığı değerler ve html 5 e ait diğer yapısal etiketler
<header>…</header> Etiketi:
Sayfamızın başı ve sonu Header ( <header> ) ve Footer ( <footer> ) etikeri arasındadır. Header etiketi Sayfalarımızın üst kısmını tanımlamakta kullanılır. Bu kullanımda arama motoru botlarına sayfamızın yapısı hakkında bilgi vermiş oluruz ve sayfamızın logo, navigasyon (menu) gibi kısımlarının burada olduğunu ifade ederiz. Html5’ten önce header kullanımı div tagları arasında css ya da id tanımlamarıyla yapılırdı. Html5 te ise bu css tanımlaması html’e ait özel bir etiket halini alıyor
<header> etiketinin dikkat edilmesi gereken hususları da vardır. Bunlardan birisi. Header etiketi yeni bir alan değil sadece bir alanın başlık kısmıdır ve <head> etiketi ile de karıştırmamak gereklidir. Head etiketi önceki derste de bahsettiğim gibi html’in temel etiketlerindendir ve kuruluşundan beri aynı yapı ve görevde zaten bulunmaktadır.
Bu etiketimiz sayfamızda. Daha önce de bahsettiğimiz gibi üstte kullanılır ve genel kullanımı bu şekildedir.
Özellik | Aldığı Değer | Açıklama |
class | Class isimleri | Bir css sınıfı tanımlamak için kullanılır |
dir | Rtl (right to left) ltr (left to right) | Metnin yönünün sağdan sola veya soldan sağamı olacağını tayin eder |
id | İd isimleri | (unique) benzersiz element tanımlamak için kullanılır. |
lang | Dil kodu | Dilin kodunu tanımlama da kullanılır. |
style | Stil tanımlaması | Etikete inline tanımlama yapılmak istendiğinde kullanılır. |
tabindex | Sayısal değer | tabindex Elementlerde TAB ile geçiş sırasını belirlemekte kullanılmaktadır. |
title | Başlık tanımlaması | Mouse ile etiket üzerine gelindiğinde çıkacak açıklama bu alana yazılır. |
header etiketi sadece sayfanın başında kullanılacak diye kesin bir kaide yoktur. Farklı etiketlerin başlıklarını tanımlamak içinde kullanılabilmektedir.
</header> <article> <header> <h1>Makalenin Başlığı</h1> <p>Makalenin Yazarı</p> </header> <p İçerik</p> </article>
NOT: Bir <header> etiketi <footer>, <addres> ve başka bir <header> elemanı içerisinde kullanılmamalıdır.
NOT: Çoğu Tarayıcı <header> etiketini aşağıdaki varsayılan değerler ile görüntülemektedir.
Destekleyen Tarayıcılar
Chrome : 6.0
Explorer : 9.0
Firefox : 4.0
Safari : 5.0
Opera : 11.1