HTML Nitelikleri Nelerdir ? Tanım ve Kullanımı

HTML nitelikleri, HTML etiketlerine ek bilgi sağlayan ve bu etiketlerin davranışlarını ve görünümlerini değiştiren özelliklerdir. Her nitelik, belirli bir etiketle birlikte kullanılır ve etikete ekstra bilgi ekler.

1. Nitelik Nedir?

Nitelikler, HTML elementlerinin nasıl görüntüleneceğini ve nasıl etkileşimde bulunacağını belirleyen özelliklerdir. Bir nitelik, bir anahtar-değer çifti şeklinde tanımlanır.

<a href="https://example.com">Ziyaret Et</a>

Yukarıdaki örnekte href niteliği, bağlantının yönlendireceği URL’yi belirtir.

2. Yaygın Kullanılan Nitelikler

• id: Belirli bir elementi tanımlamak için kullanılır. Sayfa içinde benzersiz olmalıdır.

<div id="header">Başlık</div>

<div id="header">Başlık</div>

class: Elementlere stil uygulamak veya benzer özellikleri gruplamak için kullanılır.

<p class="highlight">Öne Çıkan Metin</p>

style: Elementin stilini doğrudan belirtmek için kullanılır.

<h1 style="color: blue;">Mavi Başlık</h1>

src: Resim veya medya dosyası gibi dış kaynakların konumunu belirtir.

<img src="resim.jpg" alt="Açıklayıcı Metin">

alt: Resim yüklenemediğinde gösterilecek alternatif metni tanımlar.

<img src="resim.jpg" alt="Resmin Açıklaması">

3. Nitelik Değerleri

Nitelik değerleri genellikle çift tırnak (” “) veya tek tırnak (‘ ‘) içinde belirtilir. Ancak, eğer değer boşsa veya yalnızca bir anahtar ise, tırnak kullanmadan da tanımlanabilir.

Örnek:

<input type="text" disabled>

Burada disabled niteliği, bir değer belirtmeden kullanılmıştır.

4. Özel Nitelikler

HTML5 ile birlikte bazı özel nitelikler de kullanılmaya başlanmıştır. Örneğin, data-* nitelikleri, kullanıcı tanımlı veri taşımak için kullanılır.

Örnek:

<div data-user-id="12345">Kullanıcı Bilgisi</div>

Sonuç

HTML nitelikleri, web sayfalarındaki elementleri tanımlamak ve yönetmek için kritik bir rol oynar. Doğru kullanıldıklarında, sayfanızın işlevselliğini ve kullanıcı deneyimini önemli ölçüde artırabilir.