HTML Attributes (Öznitelikler)

Türkçeye öznitelik olarak çevrilen HTML attributes yapıları, HTML elementlerine ek bilgi sağlarlar.

HTML Öznitelikleri

HTML öznitelikleri iki bölümden oluşurlar. Bunlar eşittir işaretiyle ayrılmış bir ad (attribute name) ve bir değer (attribute value) olmak üzere ad=”değer” şeklinde “başlangıç etiketlerinin” içine yazılırlar. Bu sayede de elementler hakkında ek bilgi sağlanır. Belirtmek gerekir ki tüm HTML elementleri kendi özniteliklerine sahiptirler.

Yukarıdaki element ile HTML belgesinde kullanılan dili belirtmek için lang adlı bir öznitelik kullanılmıştır. Bu sayede sayfanın dilinin Amerikan İngilizcesi olduğu belirtilmiştir.

Bu seferde HTML belgesinin dilini Fransızca olarak belirten ek bilgi verilmiştir. Görüldüğü gibi öznitelikler sayesinde HTML elementlerine çeşitli ek bilgiler aktarılabilmektedir.

Öznitelik adı, elementin içeriği hakkında ne tür ek bilgiler sağlandığını belirtir. Her ne kadar HTML5 ile öznitelik adlarında büyük harf kullanılmasına ve tırnak işaretlerinin kullanılmamasında bir mahsur görmese de bu pek de önerilmemektedir.

Nitelik değerlerinin etrafındaki çift tırnak, tek tırnak olarak da yazılabilir. Ancak yaygın kullanım olan çift tırnağı kullanmakta fayda var. Zira temiz bir kod alışkanlığı kazanmak adına öznitelik adları (attribute names) küçük harflerle yazılmalı ve değerler de (attribute values) tırnak işareti ile yazılmalıdır.

Yerleşimleleriyle alakalı olarak HTML öznitelikleri 3 alt kategoriye ayrılmaktadır:

• Global Attributes (tüm HTML etiketlerle kullanılabilir)
• Multi-tag Attributes (bunlar sınırlı sayıdaki HTML etiketlerinde kullanılabilir)
• Single-tag Attributes (bunlar belirli bir HTML etiketinde kullanılabilir)

Global HTML Attributes

ATTRIBUTE
id
class
style
data-*
hidden
title
tabindex
lang
draggable
accesskey
inputmode
spellcheck
autocapitalize
contenteditable
dir
is

Multi-tag HTML Attributes

ATTRIBUTE	ELEMENT
alt	img area input
autocomplete	input select textarea form
autofocus	input select textarea button
autoplay	audio video
cite	q blockquote del ins
colspan	td th
controls	audio video
crossorigin	img link script audio video
datetime	time del ins
dirname	input textarea
disabled	input select textarea button option optgroup fieldset
download	a area
for	label output
form	input select textarea button meter output object fieldset
formaction	button input
formenctype	button input
formmethod	button input
formnovalidate	button input
formtarget	button input
headers	td th
height	img input canvas svg video embed iframe object
href	a area link base
hreflang	a area link
label	track option optgroup
loop	audio video
max	input meter progress
maxlength	input textarea
media	a area link style source
min	input meter
multiple	input select
muted	audio video
name	input select textarea button iframe map meta output fieldset object param
placeholder	input textarea
preload	audio video
readonly	input textarea
rel	a area link form
required	input select textarea
rowspan	td th
size	input select
sizes	img link source
span	col colgroup
src	img script iframe audio video embed input source track
srcset	img source
target	a area form base
type	input button link style a area ol script source embed object
usemap	img object
value	input button option data li meter progress param
width	img input canvas svg video embed iframe object

Single-tag HTML Attributes

ATTRIBUTE	ELEMENT
abbr	th
accept	input
accept-charset	form
action	form
async	script
charset	meta
checked	input
cols	textarea
content	meta
coords	area
data	object
default	track
defer	script
enctype	form
high	meter
http-equiv	meta
ismap	img
kind	track
list	input
loading	img
low	meter
method	form
novalidate	form
open	details
optimum	meter
pattern	input
ping	a
poster	video
reversed	ol
rows	textarea
sandbox	iframe
scope	th
selected	option
shape	area
srcdoc	iframe
srclang	track
start	ol
step	input
wrap	textarea