HTML Form Oluşturma 2

HTML de form oluşturmayı göstermiştim. Şimdi kalan from elemanlarını anlatacağım.

Birden fazla seçeneği aynı anda seçmek için checkbox elemanı kullanılır. Bu eleman için <input> etiketinin type özelliğine checkbox yazılır. Name özellikleri farklı verilmelidir.

<html>
<head></head>

<body>

<form>
<input type="checkbox" name="bir">1<br>
<input type="checkbox" name="iki">2<br>
<input type="checkbox" name="uc">3<br>
</form>

</body>
</html>


Formda açılır liste kullanmak için <select> etiketi kullanılır. Açılır listeye elemanlar eklemek için <option> etiketi kullanılır.


<html>
<head></head>

<body>

<form>
<select>
<option value="turkce">Türkçe</option>
<option value="ingilizce">İngilizce</option>
<option value="arapca">Arapça</option>
</select>
</form>

</body>
</html>

Gözüken yazı ilk optiondan gelir. Eğer gözüken yazıyı değiştirmek istiyorsanız; seçeceğiniz option etiketine selected özelliği eklemeniz gerekmektedir. Sadece selected option değilde, tüm birkaç optionun görünmesini istiyorsanız select etiketine size özelliği eklemeniz gerekmektedir. Son olarak bir seçim değilde birden fazla seçim yapılabilmesini istiyorsanız select etiketine multiple yazmanız gerekmektedir. Multiple özelliğini aktif edince, açılır menü scrollu bir menüye dönüşecektir. Şimdi bunlarla ilgili bir örnek yaparak iyice pekiştirelim.


<html>
<head></head>

<body>

<form>
<select size="2" multiple>
<option value="turkce">Türkçe</option>
<option value="ingilizce" selected>İngilizce</option>
<option value="arapca">Arapça</option>
</select>
</form>

</body>
</html>

Adres gibi uzun metinler type si text olan elemanlarda satır boyunca devam edeceği için zor durumlar yaşatabilir. Bunun için <textarea> etiketi kullanılır.


<html>
<head></head>

<body>

<form>
<textarea name="message" style="width:200px; height:200px;">Uzun metinler böylelikle daha kolay gözükecek ve düzenlenebilecek.</textarea><br>

<input type="submit" value="GÖNDER">
</form>

</body>
</html>

Furkan Aktaş

Bilgisayar Mühendisiyim. Microsoft MCSA Web Applications Sertifikasına Sahibim. Aktif iş hayatımda Full Stack .Net Developer olarak çalışmaktayım.

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir