Form Dosyasını indirmek içintıklayınız.
Form Bileşenlerinin Çerçeve içine alınarak Gruplanması <fieldset></fieldset>
Çerçevenin İsimlendirilmesi <legend>Grubun Genel Adı</legend>
Text Bileşeni :
<input type="text" name="adsoyad" required="">
Radyo Buton: <input type=”radio” name=”cinsiyet” value=”k”>Kız
<input type=”radio” name=”cinsiyet” value=”e”>Erkek
Tarih İçin <input type=”date” name=”dtarihi”>Listeden Seçim :<select name=”ogrenim”>
<option value=”1″>İlk Öğretim</option>
<option value=”2″>Orta Öğretim</option>
<option value=”3″>MYO</option>
</select></td>Listeden Yazarak Bilgi Seçme:<input list=”dyeri”>
<datalist id=”dyeri”>
<option value=”Malatya”>
<option value=”Ankara”>
<option value=”Eskişehir”>
<option value=”Bursa”>
<option value=”Bilecik”>
</datalist>Gönder ve Reset Düğmeleri:<input type=”submit” name=”” ></td><td><input type=”reset” name=””>
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<fieldset><legend style="text-align: center;">Üyelik Formu</legend>
<form action="http://www.google.com" method="GET">
<table align="center">
<tr><td>Ad Soyad:</td>
<td><input type="text" name="adsoyad" required> </td>
</tr>
<tr><td>Cinsiyet:</td>
<td><input type="radio" name="cinsiyet" value="k">Kız <input type="radio" name="cinsiyet" value="e">Erkek
</td>
</tr>
<tr><td>Doğum Tarihi</td><td><input type="date" name="dtarihi"></td>
<tr><td>Şifre</td><td><input type="password" name="sifre"></td></tr>
<tr><td>En Sevdiğiniz Renk</td><td><input type="color" name="ensevrenk"></td></tr>
<tr><td>Doğum Yeri</td><td><input list="dyeri">
<datalist id="dyeri">
<option value="Malatya">
<option value="Ankara">
<option value="Eskişehir">
<option value="Bursa">
<option value="Bilecik">
</datalist></td></tr>
<tr><td>Öğrenim Durumunuzu Seçiniz</td><td><select name="ogrenim">
<option value="1">İlk Öğretim</option>
<option value="2">Orta Öğretim</option>
<option value="3">MYO</option>
</select></td></tr>
<tr><td><input type="submit" name="" ></td><td><input type="reset" name=""></td></tr>
</table></form>
</fieldset>
</body>
</html>
Bir yanıt bırakın Cevabı iptal et