1
EXE RANK
Mustafa Yılmaz
Fexe Kullanıcısı
Puanları
0
Çözümler
0
- Katılım
- 29 Eyl 2012
- Mesajlar
- 1,022
- Tepkime puanı
- 0
- Puanları
- 0
- Web sitesi
- netbilgini.com
HTML5 - Yeni Elemanlar ve Özellikler
HTML5'in yavaş yavaş hayatımıza girmesi ile birlikte, yeni eklenen ve kullanımdan kalkan elemanlarda oldu. Bu yazımda bunları gözden geçireceğiz
HTML5 dili yeni bir yapıyla geliyor ve HTML5 geliştiricileri yeni yapıda elemanların barındırabileceği içerik bilgileri gruplandırılmış vaziyette karşımıza çıkarıyor. Bu yapıya İçerik Modeli (Content Models) adını verdiler. Kısaca bahsedecek olursam; Content Models, kullanıcağınız elemanın hangi içeriğe sahip olacağını tanımlıyor diyebiliriz. Bunlar zaten gruplandırılmış vaziyette. Şimdi içerik modellerine göre elemanlara bi bakalım:
Metadata: <meta>, <title>, <style>, <base>, <command>, <link>, <noscript>, <script> elemanlarından oluşan bir grup. Bu gruptaki elemanlar, sayfanın bilgilerini, davranışlarını ve görünümünü değiştirebilir.
Heading: <hgroup>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6> elemanlarından oluşan gruptur. Sayfanızda oluşturduğunuz bir alanın başlığını tanımlayabileceğiniz elemanlardır.
Sectioning: <nav>, <article>, <aside>, <section> elemanlarından oluşan gruptur. Bu elemanlar, HTML5 ile birlikte geldi.
Phrasing: <textarea>, <sub>, <sup>, <svg>, <strong>, <b>, <u>, <i>, <span>, <p>, <time>, <var>, <video>, <wbr>, <label>, <mark>, <math>, <meter> ... gibi elemanlardan oluşan gruptur. Sayfanızda kullandığınız metinleri oluşturuken kullandığınız yada başka bir işlem için tanımladığınız elemanlardır.
Interactive: <label>, <select>, <textarea>, <keygen>, <button>, <input>, <a>, <details>, <embed>, <iframe> ... gibi elemanlardan oluşan gruptur. Bu gruptaki elemanlar, sayfanıza gelen kullanıcılar ile etkileşim kurabilmek, bilgi alabilmek için kullanılır.
Embedded: <canvas>, <video>, <audio>, <img>, <iframe>, <object>, <embed>, <svg> gibi elemanların bulunduğu gruptur. Genellikle dışarıya bağlantılı elemanlardır. Yani dış bir kaynaktan alınan veri ile veya Javascript gibi bir script dili ile etkileşimli kullanılabilen elemanlardır. (Bu bölümde de HTML5 ile gelen bazı etiketler bulunmaktadır ve Javascript ile etkileşimli olarak kullanılan elemana örnek olarak <canvas>'ı verebiliriz.)
Flow: <canvas>, <blockquote>, <cite>, <iframe>, <img>, <input>, <script>, <address>, <aside>, <audio>, <video>, <article>, <a>, <b>, <u>, <abbr>, <small>... gibi elemanlardan oluşan gruptur. Metin , görüntü veya sayfa içine gömüşmüş olarak kullanılan elemanlardır.
Genel HTML5 Eleman Özellikleri:
HTML5 kodlarında da, diğer HTML elemanlarında bulunduğu gibi eleman parametreleri bulunmaktadır. Bunlara bakacak olursak:
- class: Style tanımlamalarında oluşturduğumuz herhangi bir sınıfı, elemanımıza atamak için kullanılır. Birden fazla değer alabilir.
- id: Elemana benzersiz bir isim vermek için kullanılır. Böylece kullanılan eleman diğer elemanlardan benzersiz olur ve Javascript ile elemanın id değerine erişip, eleman üzerinde istediğimiz uygulamaları yapabiliriz.
- accsesskey: Elemana klavye kısayolu tanımalamak için kullanılır. Aldığı değer karakter'dir.
- tabindex: Eleman için, klavye TAB tuşuyla yapacağımız sekme sırasını ayarlar.
- title: Elemana bilgi, açıklama ekleyebileceğimiz özelliğimiz.
- style: Eleman içerisinde, elemana css style kodlamaları yapıp, yapısını değiştirebileceğimiz özellik.
- lang: Elemanın içeriğinin dilini belirttiğimiz özellik. Örneğin: tr, en
- contenteditable (HTML5): Eleman içeriğinin düzenlenip düzenlenmeyeceği ile ilgili özelliği belirtmek için kullanılır. true veya false değer alır.
- contextmenu (HTML5): Elemanı, herhangi bir menü elemanıyla ilişkilendirmek için kullanıcağımız özellik. İlişkilendireceğimiz menü elemanının id değerini alır.
- spellcheck (HTML5): Eleman içerisindeki metinin dil bilgisi ve yazım kurallarını kontrol eden özelliktir. true veya false değeri alır. Değer true ise, yazım kurallarını kontrol eder.
- draggable (HTML5): Elemanın sürüklenebilir olup olmadığını belirten özelliktir. true veya false değeri alır.
- zone (HTML5): Elemanın, sürükle-bırak işlemlerinde, bırakılma anındaki işlevi belirtir. Aldığı değerler copy, move ve link değerlerini alır.
- hidden (HTML5): Elemanı gizlemek için kullanılır. hidden değerini alır.
- http://burakdemirtas.org'dan alıntıdır.