Bir HTML Etiketine Özellik Nasıl Eklenir

HTML dili bir dizi öğe içerir. Bunlar yaygın olarak kullanılan web sitesi bileşenleri paragraflar, başlıklar, bağlantılar ve resimler gibi. Üstbilgi, gezinme, altbilgi ve daha fazlası dahil olmak üzere HTML5 ile tanıtılan bir dizi yeni öğe de vardır. Bu HTML öğelerinin tümü, bir belgenin yapısını oluşturmak ve ona anlam vermek için kullanılır. Öğelere daha fazla anlam eklemek için onlara nitelikler verebilirsiniz.

Temel bir HTML açılış etiketi < karakteriyle başlar. Bunu etiket adı takip eder ve son olarak etiketi > karakteriyle tamamlarsınız. Örneğin, açılış paragrafı etiketi şu şekilde yazılır:

Bir öznitelik eklemek için HTML etiketi, önce etiket adından sonra bir boşluk koyarsınız (bu durumda bu "p" olur). Ardından, kullanmak istediğiniz öznitelik adını ve ardından eşittir işaretini eklersiniz. Son olarak, nitelik değeri tırnak içine alınacaktır. Örneğin:


Etiketlerin birden fazla özelliği olabilir. Her özniteliği diğerlerinden bir boşlukla ayırırsınız.


Gerekli Niteliklere Sahip Öğeler

instagram viewer

Bazı HTML öğeleri, amaçlandığı gibi çalışmasını istiyorsanız, aslında nitelikler gerektirir. Görüntü öğesi ve bağlantı öğesi buna iki örnektir.

görüntü öğesi "src" özniteliğini gerektirir. Bu özellik, tarayıcıya o konumda hangi görüntüyü kullanmak istediğinizi söyler. Özniteliğin değeri, görüntünün dosya yolu olacaktır. Örneğin:

şirket logomuz

Bu öğeye başka bir öznitelik eklediğimizi fark edeceksiniz, "alt" veya alternatif metin özniteliği. Bu, görseller için teknik olarak gerekli bir nitelik değildir, ancak erişilebilirlik için her zaman bu içeriği eklemek en iyi uygulamadır. alt özelliğinin değerinde listelenen metin, bir resim yüklenemiyor bazı sebeplerden dolayı.

Belirli nitelikler gerektiren başka bir öğe, bağlantı veya bağlantı etiketidir. Bu öğe, "köprü metin başvurusu" anlamına gelen "href" niteliğini içermelidir. bu bağlantı gitmeli." Tıpkı görüntü öğesinin hangi görüntünün yükleneceğini bilmesi gerektiği gibi, bağlantı etiketi de nerede olması gerektiğini bilmelidir. için. Bir bağlantı etiketi şu şekilde görünebilir:


Bu bağlantı artık bir kişiyi bir özniteliğin değerinde belirtilen web sitesine getirecektir. Bu durumda, Dotdash'in ana sayfasıdır.

CSS Kancaları Olarak Nitelikler

Niteliklerin başka bir kullanımı, "kanca" olarak kullanılmalarıdır. CSS stilleri. Web standartları, sayfanızın yapısını (HTML) stillerinden ayrı tutmanızı gerektirdiğinden (CSS), yapılandırılmış sayfanın web'de nasıl görüntüleneceğini belirlemek için CSS'deki bu öznitelik kancalarını kullanırsınız. tarayıcı. Örneğin, HTML belgenizde bu işaretleme parçasına sahip olabilirsiniz.


Bu bölümün arka plan renginin siyah (#000) ve yazı tipi boyutunun 1.5em olmasını istiyorsanız, bunu CSS'nize eklersiniz:

.özellikli { arka plan rengi: #000; yazı tipi boyutu: 1.5em;}

"Featured" class niteliği, CSS'de bu alana stiller uygulamak için kullandığımız bir kanca görevi görür. İstersek burada bir ID niteliği de kullanabiliriz. Hem sınıflar hem de kimlikler evrensel niteliklerdir, yani herhangi bir öğeye eklenebilirler. Her ikisi de o öğenin görsel görünümünü belirlemek için belirli CSS stilleriyle hedeflenebilir.

Javascript ile ilgili

Son olarak, belirli HTML öğelerinde öznitelikler kullanmak da Javascript'te kullanabileceğiniz bir şeydir. Belirli bir kimlik özniteliğine sahip bir öğe arayan bir komut dosyanız varsa, bu, HTML dilinin bu ortak parçasının başka bir kullanımıdır.

instagram story viewer