HTML input Etiketi

<input> Etiketi

Örnek

İki input alanlı ve onaylama butonlu bir HTML formu:

<form>
    Email: <input type="text" name="email"/><br/>
    Şifre:   <input type="text" name="sifre"/><br/>
                <input type="submit" value="Onayla"/>
</form>

<input> Tanımı ve Kullanımı

<input> etiketi kullanıcının bilgi girebileceği bir girdi alanını belirler.

<input> elementleri, kullanıcıların bilgi girişine izin veren girdi kontrollerini bildirmek için <form> elementi içerisinde kullanılır.

Girdi alanı özellik türüne bağlı olarak bir çok yönde çeşitlilik kazanabilir.


Tarayıcı Desteği

Element
<input> Var Var Var Var Var Var

İpuçları ve Notlar

Not: <input> elementi boştur, sadece özellikleri içerir.

İpucu: <input> öğelerine etiketler belirlemek için <label> elementini kullanın.


HTML 4.01 ile HTML5 arasındaki farklar

"align" özelliği HTML5'te desteklenmiyor.

HTML5'te, <input> etiketinin bir kaç yeni özelliği var, ve type özelliği bazı yeni değerlere sahip.


HTML ile XHTML arasındaki farklar

HTML'de <input> etiketinin kapanış etiketi yoktur.

XHTML'de ise <input> etiketi doğru bir şekilde kapatılmalıdır: <input />


Özellikler

= HTML5'te yeni.

Özellik Değer Tanım
accept dosya_uzantısı
audio/*
video/*
image/*
medya_türü
Sunucunun kabul ettiği dosya türlerini belirler. (sadece type="file" için)
align left
right
top
middle
bottom
HTML 5'te desteklenmiyor.
Resim girdisinin hizalanışını belirler. (sadece type="image" için)
alt yazı Resimler için alternatif metni tanımlar. (sadece type="image" için)
autocomplete on
off
<input> elementinin otomatik tamamlama özelliğinin açık veya kapalı olacağını belirtir.
autofocus autofocus Sayfa yüklenirken <input> elementine otomatik olarak odaklanmayı belirler.
checked checked Sayfa yüklenirken bir <input> elementinin vurgulu seçenek olduğunu belirler. (type="checkbox" veya type="radio" için)
disabled disabled Bir <input> elementinin engellendiğini belirtir.
form form_id <input> elementinin ait olduğu bir veya daha fazla formu belirler.
formaction URL Form onaylandığında girdi kontrolünü yürütecek olan dosyanın URL'sini belirler. (type="submit" ve type="image" için)
formenctype application/x-www-form-urlencoded
multipart/form-data
text/plain
Form bilgisinin sunucuya gönderilirken nasıl şifreleneceğini belirler. (type="submit" ve type="image" için)
formmethod get
post
Eylemi gerçekleşeceği URL'ye bilgiyi göndermek için HTTP metodunu tanımlar. (type="submit" ve type="image" için)
formnovalidate formnovalidate Form elementlerinin onaylandığında, doğrulanmaması gerektiğini tanımlar.
formtarget _blank
_self
_parent
_top
çerçeve_adı
Form onaylandıktan sonra yanıtın nerede görüntüleneceğini belirler.(type="submit" ve type="image" için)
height piksel <input> elementinin yüksekliğini belirler. (sadece type="image" için)
list verilistesi_id <input> elementi için öntanımlı ayarlar içeren bir <datalist> elementine kaynak gösterir.
max sayı
tarih
<input> elementi için maksimum değeri tanımlar.
maxlength sayı <input> elementi içerisinde izin verilen maksimum karakter sayısını belirler.
min sayı
tarih
<input> elementi için minimum bir değer tanımlar.
multiple multiple Kullanıcının bir <input> elementi içerisine birden fazla değer girebileceğini belirtir.
name yazı <input> elementinin adını belirler
pattern ifade <input> elementinin değerinin kıyaslanacağı bir düzenli ifade belirler.
placeholder yazı Bir <input> elementinin tahmini değerini tanımlayan kısa bir ipucunu belirtir.
readonly readonly Girdi alanının salt-okunur olduğunu belirtir.
required required Formu onaylamadan önce doldurulması zorunlu alanları ifade eder.
size sayı Bir <input> elementinin karakter genişliğini belirler.
src URL Onaylama butonu olarak kullanılacak olan görüntünün URL'sini belirtir.
step sayı Girdi alanı için kurallı sayı aralıkları belirler.
type button
checkbox
color
date
datetime
datetime-local
email
file
hidden
image
month
number
password
radio
range
reset
search
submit
tel
text
time
url
week
<input> elementinin göstereceği türü belirler.
value yazı <input> elementinin değerini tanımlar.
width piksel <input> elementinin genişliğini belirler. (sadece type="image" için)

Standart Özellikler

<input> etiketi Standart Özellikleri desteklemektedir.

HTML Standart Özellikler'i inceleyebilirsiniz.


Olay Özellikleri

<input> etiketi Olay Özelliklerini desteklemektedir.

HTML Olay Özellikleri'ni inceleyebilirsiniz.

Yorumlar

Bu blogdaki popüler yayınlar

HTML yorum etiketi ile öğe gizleme örneği

HTML Resimler

Html5 canvas animasyon dersleri Javascript Yilan Oyunu

Javascript ile neler yapılabilir

HTML blockquote Etiketi Örnek

YouTube Reklam Engelleyici

Linklerin Renklerini Değiştirme Örnek