HTML5 Input Tipleri

HTML5 ile birlikte gelen input tiplerini birlikte inceleyelim..

Tip: color

Input’u bir renk seçicisi haline getirir.

Tarayıcı Desteği:

Örnek Kullanımı;

————–

Tip: date

Input’u bir tarih seçicisi haline getirir.

Tarayıcı Desteği:

Örnek Kullanımı;

————–

Tip: datetime-local

Input’u bir zaman seçicisi haline getirir. Tarih ve Saat seçtirmeye olanak sağlar.

Tarayıcı Desteği:

Örnek Kullanımı;

————–

Tip: email

Input’u geçerli bir eposta girilecek hale getirir. HTML5 ile form kontrolleri yaparken otomatik olarak bu tipteki inputa eposta kontrolü yapacaktır.

Tarayıcı Desteği:

Örnek Kullanımı;

————–

Tip: month

Input’u ay ve yıl girilecek hale getirir.

Tarayıcı Desteği:

Örnek Kullanımı;

————–

Tip: number

Input’u sayı girilebilecek hale getirir.

Tarayıcı Desteği:

Örnek Kullanımı;

Ayrıca bu tip için şu niteliklerde kullanılabilir;
max (maksimum belirlenecek sayı)
min (minimum belirlenecek sayı)
step (artış sayısını belirler)

Örnek Kullanımı;

————–

Tip: range

Input’u değer seçilebilecek bir slider haline getirir.

Tarayıcı Desteği:

Örnek Kullanımı;

Ayrıca bu tip için şu niteliklerde kullanılabilir;
max (maksimum belirlenecek sayı)
min (minimum belirlenecek sayı)
step (artış sayısını belirler)

Örnek Kullanımı;

————–

Tip: search

Input’un bir arama kutusu olduğunu belirlemek için kullanılır.

Tarayıcı Desteği:

Örnek Kullanımı;

————–

Tip: tel

Input’a girilen değerin bir telefon numarası olduğu belirlenir.

Tarayıcı Desteği:

Örnek Kullanımı;

————–

Tip: time

Input’u zaman belirlenecek hale getirir. Sadece saat ve dakika belirtilir.

Tarayıcı Desteği:

Örnek Kullanımı;

————–

Tip: url

Input değerinin bir url (link) olduğu belirlenir. HTML5 form kontrolü yapılırken bunu dikkate alacak ve girilen değerin url olup olmadığı otomatik kontrol edilecektir.

Tarayıcı Desteği:

Örnek Kullanımı;

————–

Tip: week

Input’ta yıl ve hafta değerleri belirlemek için kullanılır.

Tarayıcı Desteği:

Örnek Kullanımı;