• Html

    Ders14- HTML5 nav etiketi

    HTML5 etiketlerinden yeni gelen nav etiketine değinelim. nav etiketi gezinti(navigasyon) linklerinin bulunduğu bölümü tanımlar. Fakat sayfadaki bütün linkler aklınıza gelmesin. Önceden el ile div’ler oluşturarak sayfamızın bir kenarına menü şeklinde navigasyon yani gezinti bölmesini yapardık. HTML 5 ile şimdi bu gezinti bölmesini nav etiketi ile daha iyi şekilde yapabiliyoruz. Nav etiketi sizi div’lerin karmaşasından kurtarırmış olur. Gezinti bölmemizin eski kullanımı; [crayon-5cf8837e85e9d536230072/] HTML5 ile nav etiketinin kullanımı; [crayon-5cf8837e85eb7017497069/] Nav etiketine dileğiniz CSS kodlarıyla müdahale edebilir daha görsel hala getirebilirsiniz. Örnek bir CSS kodu aşağıda verilmiştir. [crayon-5cf8837e85ec5234015092/]

  • Html

    Ders13- HTML 5 hgroup etiketi

    Yeni HTML 5 etiketlerinden biri olan ve h elementlerini gruplamak için kullanılan hgroup etiketine bakalım. Eğer içeriklerimiz birden fazla h elementi içeriyorsa bunları grup şeklinde tanımlayabiliriz. h1,h2,h3,h4,h5,h6 başlık etiketlerini gruplamak için kullanabileceğimiz yeni html5 etiketi olan hgroup etiketinin kullanımına örneklerle bakalım. Article etiketi altında bir başlık etiketini hgroup kullanmadan gösterme Article etiketi altında header etiketini kullanarak yazdırma Burada hgroup kullanmaya gerek yoktur. Başlık ve zaman bilgisini header da gösterildi. Article etiketi altında başlık ve alt başlık kullanımı Birden fazla başlık etiketi kullanacağımız için bu h etiketlerini hgroup etiketiyle bir gruplama yaptık. Article etiketi altında header etiketi altında gruplama yapma Özetle Bu makalede, hgroup etiketinin nasıl kullanılacağını gösterdik. Tek bir başlık…

  • Html

    Ders12- HTML 5 header ve footer etiketi kullanımı

    header ve footer etiketleri de html5 ile gelen yeni yapısal etiketlerdendir. header sayfanın başlık kısmının tanımlandığı yani başlık kısmında olması gereken ögelerin gruplandığı bölümdür diyebiliriz. Sadece başlığı yazacaksak h1 ile h6 arasındaki etiketler kullanılabilir. Header içerisinde örneğin sayfanın banner’ı, başlığı, logosu gibi bilgilerde yer alır. Bir sayfada birden fazla header da kullanılabilir. Özellikle siteye ait içindekiler tablosu oluşturulurken header işimize yarayabilir. header ayrıca section, article ve aside etiketleri içinde kullanılabilir. section ile sayfayı bölümledikten sonra istersek bu bölümü başlık kısmıyla da ayırabiliriz. footer da header’a benzer bir yapıda geliştirilmiştir. Sayfanın ya da bölümlendirmenin en altında kullanılacak olan elemanları gruplamak için kullanılır. Şimdi temiz bir html5 projesini Dreamweaver’da açalım. Body kısmının…

  • Html

    Ders11- HTML5 aside etiketi kullanımı

    Bölümlendirme için yeni oluşturulan etiketlerden biri de aside etiketidir. Diğer bölümlendirme etiketi gibi kullanılan bu etiket genelde web sayfalarında menülerimizi yerleştirdiğimiz sidebar isimli div’e karşılık gelmektedir. Yan menü olarak isimlendirme de mümkündür. Aside etiketi içerisinde başlık, paragraf, tablo gibi etiketler kullanılabilir. Bununla birlikte site içinde yer alacak resimler, reklamlar, menüler bu bölüm içerisinde yayınlanabilir. Biz örneklerimizi önceki derslerimizin devamı şeklinde devam ediyoruz. Bir önceki dersimizde article konusunun üzerinden devam edelim. Bir önceki dersimize bakmak için tıklayınız En alttaki div’in üzerinde section etiketinin altına bir aside etiketi açalım ve buna da bir id verelim. Ben örneğimde solmenu seklinde bir id vereceğim. Menümüz için oluşturacağımız liste için sırasız bir liste oluşturalım. Şimdi…