HTML5: Input Types Kullanımı

HTML5: Input Types Kullanımını öğrenelim.

HTML5 kodlama hayatımızda bir çok yer kaplayan kodlamaları HTML5 ile kısa yollar ve yeni nesil tag,eklenti,elementler ile kolaylaştırmaktadır.

Bu dersimizde HTML5 ile forum elementlerinin (Input Types) kullanımını öğrenelim.


HTML5 Input Types

[list]
[*] color
[*] date
[*] datetime
[*] datetime-local
[*] email
[*] month
[*] number
[*] range
[*] search
[*] tel
[*] time
[*] url
[*] week
[/list]

Not: HTML5 Input Types kullanımı tag'ı içerisinde yer alır.

HTML5 Forum Elementleri


Renk Seçiniz: <input type="color" name="renk">



Tarih Seçiniz: <input type="date" name="tarih">



Tarih ve Saat Seçiniz:<input type="datetime-local" name="tarihsaat">



Email Adresiniz:<input type="email" name="email">



Ay Seçiniz:<input type="month" name="ay">



Sayı Seçiniz:<input type="number" name="sayi">



Aralık Seçiniz:<input type="range" name="aralik">



Ara:<input type="search" name="ara">



Telefon Numaranız:<input type="tel" name="telefon">



Zaman/Saat:<input type="time" name="saat">



Adres[URL]:<input type="url" name="url">



Hafta Seçiniz:<input type="week" name="hafta">



Örnek

<!DOCTYPE html>

<html>

<body>



<form action="gonder.php">

    Renk Seçiniz: <input type="color" name="renk"><br>

    Tarih Seçiniz: <input type="date" name="tarih"><br>

    Tarih ve Saat Seçiniz:<input type="datetime-local" name="tarihsaat"><br>

    Email Adresiniz:<input type="email" name="email"><br>

    Ay Seçiniz:<input type="month" name="ay"><br>

    Sayı Seçiniz:<input type="number" name="sayi"><br>

    Aralık Seçiniz:<input type="range" name="aralik"><br>

    Ara:<input type="search" name="ara"><br>

    Telefon Numaranız:<input type="tel" name="telefon"><br>

    Zaman/Saat:<input type="time" name="saat"><br>

    Adres[URL]:<input type="url" name="url"><br>

    Hafta Seçiniz:<input type="week" name="hafta"><br>

       <input type="submit">

</form>



</body>

</html>



Çıktı:


Not:
[list]
[*] HTLM5 Forum input içerisi çeviri taryıcı diline göre çevrilmektedir.
[*] Forum elementleri ek özellik ve değer barındırır.
[*] Tüm büyük tarayıcılar desteklemektedir. Lakin bazı tarayıcılarda desteklememe özelliği vardır.
[/list]
  • Etiketler;
Yorum Yaz

Yorum yazabilmek için üye girişi yapmanız gerekiyor!

• 6 yıl önce
Bir Kısmını Biliyordum. Biraz Daha Öğrendim. Teşekkürler.
• 6 yıl önce
Merhaba; Serhat-KILIC Rica Ederim, İlginizden Dolayı Teşekkür Ederim. Çalışmalarınızda Başarılar Dilerim

Yukarı Git