Yeni bir html konusuyla devam etmek istiyorum.Hemen hemen bütün web sitelerin de iletişim formu vardır.
İletişim formu neden gereklidir ?
iletisim formu sayesinde sitemize gelen ziyaretçilerle iletişim kurabilir , onların görüşlerini ve isteklerini öğrenebilir böylelikle site ziyaretçilerimiz ile site sahibi arasında bir kontakt kurulmuş olur. kısaca açıklamak gerekirse
iletisim formununu bu sekilde tanımlayabiliriz.
Şimdi
Html iletişim formumuzu adım adım olusturmaya başlayalım.
Öncelikle Adı Ve Soyadı girişi yapılması için ıkı tane metın kutusu ekleyelim :
<input type="text" name="ismi" />
<input type="text" name="Soyismi" />
metin kutusu eklemek için input type text etiketini kullanırız.
Metin kutularını ekledikten sonra şimdi Onay kutusu nu ekleyelim.
<input type="checkbox" name="medeni" value="evli" /> onay kutusunu eklemek
için checkbox etiketini kullandık
Şimdi ise Adres , içerik vs için eklememiz gereken text area kısmını ekleyelim.
<
textarea name="
adresi"
rows="6
"
cols="
40">
Açılır çoklu seçenek kutusu yani listbox :
<select name="iller" size="1">
<optgroup label="Marmara">
<option>Istanbul</option>
gibi etiketleri kullanacagız.
Radio buton eklemek için radio etiketini kullanacagız.
<input type="radio" name="uzman" value="Photoshop" />
Son olarak buton ekleyerek formumuzu tamamlamış olacagız.
<input type="submit" value="Gönder" />
kodları takip ederseniz aşagıdakı formun aynısını olusturabilirsiniz.
Ayrıca CSS kullanarak görünüm olarak cok daha zengin gornume sahip
bir form elde edebilirsiniz.
Örnek İletişim Formu
Son olarak Form için bütün html kodlarını ekliyorum.Bu kodları kullarak aynı form a sahip olabilirsiniz.İstedıgınız sekılde uzerınde calısıp daha da güzel bir form haline getirebilirsiniz.
<b><td> Soyadi : </td><b>
<td><input type="text" name="Soyismi" /></td>
<tr>
<td>Medeni Durumu : </td>
<td><input type="checkbox" name="medeni" value="evli" /> Evli
<input type="checkbox" name="medeni" value="evli" /> Bekar </td>
<tr>
<td> Adresi : </td>
<td><textarea name="adresi" rows="6" cols="50"></textarea></td>
</tr>
<tr>
<td> Yasadiginiz Sehir : </td>
<td><select name="iller" size="1">
<optgroup label="Marmara">
<option>Istanbul</option>
<option>Bursa</option>
<option>Sakarya</option>
<option>Kocaeli</option>
</optgroup>
<optgroup label="Ege">
<option>Izmir</option>
<option>Manisa</option>
<option>Aydin</option>
</optgroup>
<optgroup label="Akdeniz">
<option>Antalya</option>
<option>Isparta</option>
<option>Mersin</option>
</optgroup>
<optgroup label="Diger">
<option>Ankara</option>
<option>Adana</option>
<option>Balikesir</option>
</optgroup>
</select>
</tr>
<tr>
<td>Uzmanlik Alani : </td>
<td><br><input type="radio" name="uzman" value="Flash" />Flash<br/>
<br><input type="radio" name="uzman" value="Photoshop" />Photoshop<br/>
<br><input type="radio" name="uzman" value="Fireworks" />Fireworks<br/>
<br><input type="radio" name="uzman" value="Php"/>Php<br/></td>
</tr>
<tr>
<td></td>
<td><input type="submit" value="Gönder" />
<input type="reset" value="Temizle" /> </td>
<tr>
</tr>
</form>
</body>
