Butonların Altına Seçenek Ekleme: HTML’de Kapsamlı Bir Kılavuz
HTML’de, kullanıcıların bir web sitesinde belirli eylemlerde bulunmalarına olanak tanıyan çeşitli form kontrolleri mevcuttur. Butonlar, bu kontrollerden biridir ve kullanıcıların bir formu gönderme, bir sayfayı yeniden başlatma ve diğer görevleri gerçekleştirme gibi eylemlere başlamalarını sağlar.
Butonların altına seçenek eklemek, kullanıcıların belirli bir eylem için birden fazla seçenek arasından seçim yapmalarına olanak tanır. Bu, kullanıcı deneyimini geliştirir ve kullanıcıların ihtiyaçlarını daha spesifik olarak karşılamalarına yardımcı olur.
Seçenek Ekleme
HTML’de bir butonun altına seçenek eklemek için option
etiketini kullanırız. option
etiketi, select
etiketinin bir alt elemanı olmalıdır.
“`html
“`
value
özniteliği, seçeneğe ilişkin değeri belirtir. Bu, seçeneği seçtiğinizde gönderilen veridir. Seçenek
özniteliği, seçeneği kullanıcıya gösterilen metni belirtir.
Seçenekleri Gruplandırma
Birden fazla seçeneği gruplandırmak için optgroup
etiketini kullanabilirsiniz. Bu, seçenekleri mantıksal gruplara ayırmanıza ve kullanıcıların seçenekleri daha hızlı bulmalarına yardımcı olur.
html
<select>
<optgroup label="Grup 1">
<option value="value1">Seçenek 1</option>
<option value="value2">Seçenek 2</option>
</optgroup>
<optgroup label="Grup 2">
<option value="value3">Seçenek 3</option>
<option value="value4">Seçenek 4</option>
</optgroup>
</select>
label
özniteliği, grup için etiketi belirtir.
Seçenekleri Seçme
Kullanıcının bir seçeneği seçmesine olanak tanımak için selected
özniteliğini kullanabilirsiniz. Bu, seçeneği seçili olarak önceden dolduracaです.
“`html
“`
Örnek
Aşagıda, bir butonun altına seçenek ekleyen bir HTML örneği verilmektedir:
“`html
“`
Bu kod, kullanıcıların bir şehir seçmelerini ve ardından “Seç” butonuna tıklayıp seçtikleri şehri göndermelerini sağlar.