HTML dili bir dizi öğe içerir. Bunlar, paragraflar, başlıklar, bağlantılar ve resimler gibi yaygın olarak kullanılan web sitesi bileşenlerini içerir. Üstbilgi, gezinme, altbilgi ve daha fazlası dahil olmak üzere HTML5 ile sunulan bir dizi yeni öğe de vardır. Tüm bu HTML öğeleri, bir belgenin yapısını oluşturmak ve ona anlam vermek için kullanılır. Öğelere daha fazla anlam katmak için onlara nitelikler verebilirsiniz. Temel bir HTML açılış etiketi
HTML etiketinize bir öznitelik eklemek için, önce etiket adından sonra bir boşluk koyarsınız (bu durumda “p”). Ardından, kullanmak istediğiniz özellik adını ve ardından eşittir işaretini eklersiniz. Son olarak, öznitelik değeri tırnak içine alınacaktır. Örneğin:
Etiketlerin birden çok özelliği olabilir. Her bir özelliği diğerlerinden bir boşlukla ayırırsınız.
Gerekli Niteliklere Sahip Öğeler
Bazı HTML öğeleri, amaçlandığı gibi çalışmalarını istiyorsanız, aslında öznitelikler gerektirir. Görüntü öğesi ve bağlantı öğesi bunun iki örneğidir. Görüntü öğesi, “src” özniteliğini gerektirir. Bu özellik, tarayıcıya o konumda hangi resmi kullanmak istediğinizi söyler. Özniteliğin değeri, görüntünün dosya yolu olacaktır. Örneğin:
Bu öğeye başka bir özellik, “alt” veya alternatif metin özelliği eklediğimizi fark edeceksiniz. Bu, teknik olarak resimler için gerekli bir özellik değildir, ancak erişilebilirlik için her zaman bu içeriğin dahil edilmesi en iyi uygulamadır. Alt özniteliğinin değerinde listelenen metin, bir görüntü herhangi bir nedenle yüklenemezse görüntülenecek olan metindir. Belirli nitelikler gerektiren başka bir öğe, bağlantı veya bağlantı etiketidir. Bu öğe, “köprü metni referansı” anlamına gelen “href” özniteliğini içermelidir. Bu, “bu bağlantının nereye gitmesi gerektiğini” söylemenin süslü bir yoludur. Tıpkı görüntü öğesinin hangi görüntünün yükleneceğini bilmesi gerektiği gibi, bağlantı etiketinin nerede olması gerektiğini bilin. Bir bağlantı etiketi şöyle görünebilir:
Bu bağlantı şimdi bir kişiyi bir özniteliğin değerinde belirtilen web sitesine getirir. Bu durumda, Dotdash’ın ana sayfasıdır.
CSS Kancaları Olarak Nitelikler
Özniteliklerin başka bir kullanımı, CSS stilleri için “kancalar” olarak kullanılmalarıdır. Web standartları, sayfanızın yapısını (HTML) stillerinden (CSS) ayrı tutmanız gerektiğini belirttiğinden, yapılandırılmış sayfanın web tarayıcısında nasıl görüntüleneceğini belirlemek için CSS’deki bu öznitelik kancalarını kullanırsınız. Örneğin, bu biçimlendirme parçasını HTML belgenizde bulundurabilirsiniz.
Bu bölümün arka plan renginin siyah (# 000) ve yazı tipi boyutunun 1.5em olmasını istiyorsanız, bunu CSS’nize eklersiniz: .featured {background-color: # 000; yazı tipi boyutu: 1.5em;}
“Özellikli” sınıf özelliği, CSS’de bu alana stil uygulamak için kullandığımız bir kanca görevi görür. İstersek burada bir kimlik özelliği de kullanabilirdik. Hem sınıflar hem de kimlikler evrensel niteliklerdir, yani herhangi bir öğeye eklenebilirler. Ayrıca, o öğenin görsel görünümünü belirlemek için her ikisi de belirli CSS stilleriyle hedeflenebilir.
Javascript ile ilgili olarak
Son olarak, belirli HTML öğelerinde öznitelikleri kullanmak da Javascript’te kullanabileceğiniz bir şeydir. Belirli bir kimlik özelliğine sahip bir öğeyi arayan bir komut dosyanız varsa, bu, HTML dilinin bu ortak parçasının başka bir kullanımıdır.