HTML Formları ve Girdileri
HTML formları sayesinde kullanıcıların farklı girdilerden bir tanesini seçmesini sağlayabilirsiniz.
Örnekler
Metin Alanı
<html>
<body>
<form action ="">
isim:
<input type="text" name="isim">
<br>
Soyisim:
<input type="text" name="soyisim">
</form>
</body>
</hmtl>
Şifre Alanı
<html>
<body>
<form action ="">
kullanici Adi:
<input type="text" name="isim">
<br>
Sifre:
<input type="password" name="sifre">
</form>
<p><b>NOT:</b> Sifre bolumune yazi yazdiginiz zaman karakterler gizleniyor</p>
</body>
</hmtl>
Formlar
Bir form içinde form elementleri taşıyan bir alandır (Giriş örneklerini inceleyiniz).
Form elementler kullanıcının girdi yapmasına olanak sağlar. Bu girdiler metin alanları, menü ya da buna benzer herhangi bir şey olabilir. Formlar <form> komutu ile başlar.
Girdileri kullanıcıdan alabilmek için kullandığımız komut <input> komutudur. Input komutunun nitelikleri ile ne tür girdi alışı olacağı belirlenir.
Örnekler
Checkboxes
<html>
<body>
<form action ="">
Mac Os X:
<input type="checkbox" name="isletim sistemi" value="Mac">
<br>
Unix:
<input type="checkbox" name="isletim sistemi" value="Unix">
<br>
Windows:
<input type="checkbox" name="isletim sistemi" value="Windows">
</form>
</body>
</hmtl>
Radyo Düğmesi
<html>
<body>
<form action ="">
Mac Os X:
<input type="radio" checked="checked" name="isletim sistemi" value="Mac">
<br>
Unix:
<input type="radio" name="isletim sistemi" value="Unix">
<br>
Windows:
<input type="radio" name="isletim sistemi" value="Windows">
</form>
</body>
</hmtl>
Basit bir drop box
<html>
<body>
<form action ="">
<select name="isletim sistemi">
<option value="Mac Os X">Mac Os X</option>
<option value="Unix">Unix</option>
<option value="Windows">Windows</option>
</select>
</form>
</body>
</hmtl>
Seçili drop box
<html>
<body>
<form action ="">
<select name="isletim sistemi">
<option value="Mac Os X">Mac Os X</option>
<option value="Unix" selected="selected">Unix</option>
<option value="Windows">Windows</option>
</select>
</form>
</body>
</hmtl>
Metin Alanı
<html>
<body>
<textarea rows="15" cols="45">
Merhaba!!!
</textarea>
</body>
</hmtl>
Düğme
<html>
<body>
<form action="">
<input type="button" value="Merhaba">
</form>
</body>
</hmtl>
Çerçeveli Girdi Ekranı
<html>
<body>
<fieldset>
<legend>
Saglik Bilgileri
</legend>
<form action="">
Height <input type="text" size="3">
Weight <input type="text" size="3">
</form>
</fieldset>
</body>
</hmtl>
Posta Yollama
<html>
<body>
<h2> Bu form ile uzerine.com'a mail atabilirsiniz </h2>
<form action="MAILTO:info@uzerine.com" method="post" enctype="text/plain">
isim:<br>
<input type="text" name="name" value="isiminiz" size="20">
<br>
Posta:<br>
<input type="text" name="mail" value="adresiniz" size="20">
<br>
Yorum:<br>
<input type="text" name="comment" value="Yorumlariniz" size="40">
<br><br>
<input type="submit" value="Yolla">
<input type="reset" value="Salla">
</form>
</body>
</hmtl>
Sonraki ders için tıklayınız...