HTML5 Giriş (Input) Tipleri

HTML5 Yeni Giriş Tipleri

HTML5 formlar için bir kaç yeni input tipine sahiptir. Bu yeni özellikler daha iyi kontrol ve doğrulama olanağı sağlar.

Bu bölüm şu yeni input tiplerini içerir:

• color
• date
• datetime
• datetime-local
• email
• month
• number
• range
• search
• tel
• time
• url
• week

	Tüm tarayıcılar yeni giriş tiplerini desteklemeyebilir. Ancak, yine de kullanabilirsiniz, sadece sıradan metin giriş alanı olarak davranacaklardır

Giriş Tipi: color

Giriş alanının bir renk içermesi için color kullanılır.

Örnek

Renk kodunu gösterme:

Bir renk seçin: <input type="color" name="favcolor">

Kendin Dene »

Giriş Tipi: date

Bir tarih seçmenize yardımcı olur.

Örnek

Bir tarih seçme:

Doğum günü: <input type="date" name="bday">

Kendin Dene »

Giriş Tipi: datetime

Bir tarih ve saat seçmenizi sağlar (time zone ile).

Örnek

Bir tarih ve saat seçme:

Doğum günü (tarih ve saat): <input type="datetime" name="bdaytime">

Kendin Dene »

Giriş Tipi: datetime-local

Bir tarih ve saat seçmenizi sağlar (time zone olmadan).

Örnek

Bir tarih ve saat seçme:

Doğum günü (tarih ve saat): <input type="datetime-local" name="bdaytime">

Kendin Dene »

Giriş Tipi: email

Input alanında bir e-posta adresi olması gerektiğinde kullanılır.

Örnek

Bir e-posta adresi girme (Form gönderildiği sırada doğrulanacaktır):

E-mail: <input type="email" name="email">

Kendin Dene »

İpucu: iPhone'lardaki Safari, email tipini tanır ve kendisi tamamlar (@ ekler ve .com seçeneklerini sunar)

Giriş Tipi: month

Kullanıcının bir ay ve yıl seçmesine olanak verir.

Örnek

Bir ay ve yıl seçme (time zone olmadan):

Doğum günü (ay ve yıl): <input type="month" name="bdaymonth">

Kendin Dene »

Giriş Tipi: number

Input alanı numerik bir değer gerektirdiği zaman kullanılır.

Ayrıca hangi sayıların kabul edilebileceğini belirtebilirsiniz:

Örnek

Sayı değeri girme (Sınırlama ile):

Miktar girin (1 ve 5 arasında): <input type="number" name="quantity" min="1" max="5">

Kendin Dene »

Daha keskin sınırlamalar için aşağıdaki sayfayı inceleyin:

• max min step value

Tüm sınırlamaların olduğu bir örnek: Kendin Dene

Giriş Tipi: range

Belirli bir aralıkta olan bir sayıyı seçmenizi sağlar

Ayrıca hangi sayıların kabul edilebileceğini belirtebilirsiniz:

Örnek

Aşağıdaki örneği inceleyin:

<input type="range" name="points" min="1" max="10">

Kendin Dene »

Daha keskin sınırlamalar için aşağıdaki sayfayı inceleyin:

• max min step value

Giriş Tipi: search

Arama işleri için search tipi kullanılır. (bir search alanı tipik bir metin (text) alanı gibi davranır).

Örnek

Aşağıdaki örneği inceleyin:

Google'da ara: <input type="search" name="googlesearch">

Kendin Dene »

Giriş Tipi: tel

Örnek

Telefon numarası girmeye yarar:

Telefon: <input type="tel" name="usrtel">

Kendin Dene »

Giriş Tipi: time

Bir saat seçmenizi sağlar.

Örnek

Bir saat seçmeye yarayan örnek (time zone olmadan):

Bir saat seçin: <input type="time" name="usr_time">

Kendin Dene »

Giriş Tipi: url

Bir giriş alanı bir URL bağlantısı içerecekse kullanılır.

Bu özellik, form gönderildiği sırada doğrulanır.

Örnek

Bir adres girme:

Ana sayfanızı ekleyin: <input type="url" name="homepage">

Kendin Dene »

Giriş Tipi: week

Bir hafta ve yıl seçmenizi sağlar.

Örnek

Bir hafta ve yıl seçme (time zone olmadan):

Bir hafta seçin: <input type="week" name="week_year">

Kendin Dene »