Thẻ <optgroup> HTML

Phần tử trong HTML được sử dụng để nhóm các tùy chọn trong danh sách thả xuống. Ví dụ:bạn có thể đã thấy các mục danh sách được nhóm lại, chẳng hạn như các khóa học tốt nghiệp và sau tốt nghiệp được hiển thị trong các nhóm khác nhau trong một danh sách thả xuống.

Sau đây là các thuộc tính−

bị vô hiệu hóa :Chỉ định rằng một nhóm tùy chọn sẽ bị vô hiệu hóa
nhãn :Chỉ định nhãn cho một nhóm tùy chọn Bây giờ chúng ta hãy xem một ví dụ để triển khai phần tử :

Bây giờ chúng ta hãy xem một ví dụ để triển khai phần tử -

Ví dụ

<!DOCTYPE html>
<html>
<body>
<h2>Educational Qualification</h2>
<select>
   <optgroup label="Graduation">
   <option value="bca">BCA</option>
   <option value="bcom">B.COM</option>
   <option value="btech">B.TECH</option>
</optgroup>
   <optgroup label="Postgraduation">
   <option value="mca">MCA</option>
   <option value="mcom">M.COM</option>
   <option value="mtech">M.TECH</option>
   <option value="msc">M.Sc</option>
</optgroup>
</select>
</body>
</html>

Đầu ra

Thẻ optgroup
HTML

Trong ví dụ trên, chúng ta có hai optgroup để thiết lập danh sách thả xuống với hai phần. Bằng cách này, chúng tôi đã nhóm các tùy chọn trong danh sách thả xuống−

<select>
<optgroup label="Graduation">
<option value="bca">BCA</option>
<option value="bcom">B.COM</option>
<option value="btech">B.TECH</option>
</optgroup>
<optgroup label="Postgraduation">
<option value="mca">MCA</option>
<option value="mcom">M.COM</option>
<option value="mtech">M.TECH</option>
<option value="msc">M.Sc</option>
</optgroup>
</select>

Tập hợp phần tử tùy chọn được sử dụng để đặt các tùy chọn khác nhau cho danh sách thả xuống và cho phép người dùng chọn bất kỳ tùy chọn nào trong số chúng từ một nhóm optiong− duy nhất−

<option value="bca">BCA</option>
<option value="bcom">B.COM</option>
<option value="btech">B.TECH</option>

Thẻ HTML

Ví dụ

Đầu ra