banner
htmldersleri
Ana SayfaANA SAYFA Dersler | Örnekler | Forum | Sıkça Sorulan Sorular |Hakkında
HTML Temel
HTML Giriş
HTML Elementler
HTML Etiketler
HTML Parametreler
HTML Biçimlendirme
HTML Özeller
HTML Bağlantılar
HTML Çerçeveler
HTML Tablolar
HTML Listeleme
HTML Formlar
HTML Resimler
HTML Arka Plan
HTML Renkler
HTML Renk Değerleri
HTML Renk İsimleri
HTML Hızlı Liste

HTML5 Ana Menü
HTML5 Giriş
HTML5 Anlamlandırma
HTML5 Giriş Tipleri
HTML5 Form Elementleri
HTML5 Form Özellikleri
HTML5 Canvas
HTML5 SVG
HTML5 Video
HTML5 Audio
HTML5 Konum
HTML5 Sürükle/Bırak
HTML5 Web Depolama
HTML5 Uygulama Bellekleme
HTML5 Web Çalışanı
HTML5 SSE

HTML Gelişmiş
HTML Tasarım
HTML Fontlar
HTML Stiller
HTML Başlık
HTML Meta
HTML URL
HTML Scriptler
HTML Std. Nitelikler
HTML Olaylar
HTML ASCII
HTML Web Sunucu

HTML Örnekler/Test
HTML Örnekler
HTML Örnek Site
HTML Test


HTML Form Oluşturma

Önceki Sonraki

HTML Formları kullanıcının klavye ile girdiği bilgileri işlemek için kullanılır.


Örnekler

Metin Alanları

Şifreli Giriş Alanları


Formlar

Bir form, form elemanlarını içinde bulunduran alandır.

Form elemanları kullanıcıların bilgi girmesini sağlayan elemanlardır. (metin alanları, açılabilir listeler, seçenek kutuları, kontrol kutuları)

Kullanım biçimi:

<form>
  <input>
  <input>
</form>



Giriş (Input)

En çok kullanılan form etiketi <input> etiketidir.

Metin Alanları

Kullanıcının rakam veya harf girmesini istediğiniz yerlerde bunu kullabilirsiniz.

<form>
Adınız: 
<input type="text" name="isim">
<br>
Soyadınız: 
<input type="text" name="soyad">
</form>

Çıktısı:

Adınız:     
Soyadınız:

Formun kendisinin görünmediğine dikkat ediniz. Ayrıca bir çok tarayıcının metin giriş alanı için varsayılan olarak 20 karakterlik alan bıraktığına dikkat ediniz. 

Seçenek Butonları (Radio Buttons)

Kullanıcının bir çok seçenek içinden sadece bir tanesini seçebilmesini istediğiniz zaman bunu kullanırsınız.

<form>
<input type="radio" name="Cinsiyet" value="Erkek"> Erkek
<br>
<input type="radio" name="Cinsiyet" value="Kadın"> Kadın
</form>

Çıktısı:

Erkek
Kadın

Kontrol kutuları (Checkboxes)

Kullanıcının, sunulan seçenekler içinden istediği kadar seçmesini sağlamak için bunu kullanabilirsiniz.

<form>
Bir bisikletim var:
<input type="checkbox" name="Tasit" value="Bisiklet">
<br>
Bir arabam var: 
<input type="checkbox" name="Tasit" value="Araba">
<br>
Bir uçağım var: 
<input type="checkbox" name="Tasit" value="Uçak">
</form>

Çıktısı:

Bir bisikletim var:
Bir arabam var:
Bir uçağım var:

Formlarda "Action" Parametresi ve "Submit" Butonu

Kullanıcı submit (gönder) butonuna tıkladığında girilen bilgiler başka bir sayfaya gönderilir. Action parametresinde ise bilgilerin hangi dosyaya gönderileceği belirtilir. Bilgilerin gönderildiği dosya, genellikle gelen bilgilerle ilgili ne tür işlem yapılacağı hakkında bilgiler içerir.

<form name="input" action="ornekler/html_form_action.php"
method="get" target="_blank">
Kullanıcı Adı: 
<input type="text" name="kullanici">
<input type="submit" value="Gönder">
</form>

Çıktısı:

Kullanıcı Adı:

Eğer yukarıdaki kutuya birşeyler yazıp butona tıklarsanız, girdiğiniz bilgileri "html_form_action.php" dosyasına gönderirsiniz. Yeni pencerede açılacak olan bu sayfada girmiş olduğunuz bilgileri görebilirsiniz.


Form Etiketleri

Etiket Açıklama
<form> Form
<input> Giriş alanı
<textarea> Çok satırlı metin giriş alanı
<label> Etiket
<fieldset> Alanların ayarlarının nasıl olacağını belirtir.
<legend> Manşet
<select> Açılabilir liste (combobox)
<optgroup> Seçenek kutusu grubu
<option> Açılabilir liste içindeki maddeleri belirtir.
<button> Buton
<isindex> Önemsiz. Bunun yerine <input> etiketini kullanınız.


Önceki Sonraki


Dersler | Örnekler | Forum | Sıkça Sorulan Sorular |Hakkında
Copyright © 2008 | Tüm Hakları Saklıdır. | Webmaster: destek@htmldersleri.org

74 kişi şuan sayfamızda geziniyor.

English Deutsch Français Español Dutch Italiano Português Български
html dersleri
Dersler Örnekler Online Test