HTML Özellikleri
HTML nitelikleri, HTML öğeleri hakkında ek bilgi sağlar.
HTML Özellikleri
- Tüm HTML öğelerinin nitelikleri olabilir
- Nitelikler, öğeler hakkında ek bilgi sağlar
- Nitelikler her zaman başlangıç etiketinde belirtilir
- Nitelikler genellikle ad/değer çiftleri halinde gelir: name="value"
href Özelliği
<a>etiketi bir köprüyü tanımlar . Nitelik
href, bağlantının gittiği sayfanın URL'sini belirtir:
Örnek
HTML Bağlantıları bölümümüzde bağlantılar hakkında daha fazla bilgi edineceksiniz .
src Özelliği
<img>etiketi, bir HTML sayfasına bir resim gömmek için kullanılır . Nitelik
src, görüntülenecek görüntünün yolunu belirtir:
Örnek
Nitelikte URL'yi belirtmenin iki yolu vardır
src
:
1. Mutlak URL - Başka bir web sitesinde barındırılan harici bir resme bağlantılar. Örnek: src="https://www.w3schools.com/images/img_girl.jpg" .
Notlar: Harici görseller telif hakkı kapsamında olabilir. Kullanmak için izin almazsanız, telif hakkı yasalarını ihlal ediyor olabilirsiniz. Ayrıca, harici görüntüleri kontrol edemezsiniz; aniden kaldırılabilir veya değiştirilebilir.
2. Göreli URL - Web sitesinde barındırılan bir resme bağlantılar. Burada URL, alan adını içermez. URL eğik çizgi olmadan başlıyorsa, geçerli sayfaya göre olacaktır. Örnek: src="img_girl.jpg". URL bir eğik çizgi ile başlıyorsa, etki alanına göre olacaktır. Örnek: src="/images/img_girl.jpg".
İpucu: Göreli URL'leri kullanmak neredeyse her zaman en iyisidir. Etki alanını değiştirirseniz kırılmazlar.
Genişlik ve yükseklik Nitelikleri
Etiket ayrıca görüntünün genişliğini ve yüksekliğini (piksel olarak) belirten ve niteliklerini
<img>de içermelidir
:
width
height
Örnek
alt Özellik
Etiket için gerekli
altöznitelik
<img>
, resim herhangi bir nedenle görüntülenemiyorsa, resim için alternatif bir metin belirtir. Bunun nedeni, yavaş bağlantı veya
srcöznitelikteki bir hata ya da kullanıcının bir ekran okuyucu kullanması olabilir.
Örnek
Örnek
Var olmayan bir resmi görüntülemeye çalışırsak ne olacağını görün:
HTML Görselleri bölümümüzde görseller hakkında daha fazla bilgi edineceksiniz .
stil Özellik
Nitelik
style, bir öğeye renk, yazı tipi, boyut ve daha fazlası gibi stiller eklemek için kullanılır.
Örnek
HTML Stilleri bölümümüzde stiller hakkında daha fazla bilgi edineceksiniz .
lang Özelliği
Web sayfasının dilini belirtmek için her zaman etiketin
langiçine özniteliği eklemelisiniz.
<html>Bu, arama motorlarına ve tarayıcılara yardımcı olmak içindir.
Aşağıdaki örnek, dil olarak İngilizce'yi belirtir:
<html lang="en">
<body>
...
</body>
</html>
lang
Öznitelikteki dil koduna ülke kodları da eklenebilir . Bu nedenle, ilk iki karakter HTML sayfasının dilini, son iki karakter ise ülkeyi tanımlar.
Aşağıdaki örnek, dil olarak İngilizce'yi ve ülke olarak Amerika Birleşik Devletleri'ni belirtir:
<html lang="en-US">
<body>
...
</body>
</html>
Tüm dil kodlarını HTML Dil Kodu Referansımızda görebilirsiniz .
başlık Özellik
Nitelik
title, bir öğe hakkında bazı ek bilgileri tanımlar.
Başlık özelliğinin değeri, fareyi öğenin üzerine getirdiğinizde bir araç ipucu olarak görüntülenecektir:
Örnek
Öneriyoruz: Daima Küçük Harf Niteliklerini Kullanın
HTML standardı, küçük harfli öznitelik adları gerektirmez.
Title niteliği (ve diğer tüm nitelikler), title veya TITLE gibi büyük veya küçük harflerle yazılabilir .
Ancak W3C , HTML'de küçük harf öznitelikleri önerir ve XHTML gibi daha katı belge türleri için küçük harf öznitelikleri talep eder.
W3Schools'da her zaman küçük harfli öznitelik adları kullanırız.
Öneriyoruz: Daima Özellik Değerlerinden Alıntı Yapın
HTML standardı, nitelik değerleri etrafında tırnak işaretleri gerektirmez.
Ancak W3C , HTML'de alıntılar önerir ve XHTML gibi daha katı belge türleri için alıntılar ister .
İyi:
Kötü:
Bazen tırnak kullanmanız gerekir. Bu örnek, bir boşluk içerdiğinden title niteliğini doğru şekilde görüntülemeyecektir:
Örnek
W3Schools'da her zaman öznitelik değerleri etrafında tırnak işaretleri kullanırız.
Tek veya Çift Alıntılar?
Nitelik değerleri etrafındaki çift tırnak, HTML'de en yaygın olanıdır, ancak tek tırnak da kullanılabilir.
Bazı durumlarda, öznitelik değerinin kendisi çift tırnak içerdiğinde, tek tırnak kullanılması gerekir:
Ya da tam tersi:
Bölüm özeti
- Tüm HTML öğelerinin nitelikleri olabilir
hrefözelliği ,
<a>bağlantının gittiği sayfanın URL'sini belirtir
srcniteliği, görüntülenecek
<img>görüntünün yolunu belirtir
- Görüntüler için boyut bilgisi sağlayan
widthve
heightözellikleri
<img>
altözniteliği, bir
<img>resim için alternatif bir metin sağlar
styleNitelik, bir öğeye renk, yazı tipi, boyut ve daha fazlası gibi stiller eklemek için kullanılır .
- Etiketin
langözelliği
<html>, Web sayfasının dilini bildirir.
titleNitelik, bir öğe hakkında bazı ek bilgileri tanımlar .
HTML Alıştırmaları
HTML Özellik Referansı
Her bir HTML öğesi için tüm niteliklerin tam listesi, HTML Nitelik Referansımızda listelenmiştir .