Tutorial HTML <optgroup>
HTML optgroup Tag - belajar html optgroup. Element
optgroup
mempunyai definisi sebagai option grup, jadi element html <optgroup>
ini mempunyai fungsi sebagai pembungkus dari element <option>
.Contoh HTML <optgroup>
<select>
<optgroup label="Font-size pixel">
<option value="13px">13px</option>
<option value="14px">14px</option>
<option value="15px">15px</option>
</optgroup>
<optgroup label="Font-size Percent">
<option value="100%">100%</option>
<option value="150%">150%</option>
<option value="200%">200%</option>
</optgroup>
</select>
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo Triksonic</title> </head> <body> <select> <optgroup label="Font-size pixel"> <option value="13px">13px</option> <option value="14px">14px</option> <option value="15px">15px</option> </optgroup> <optgroup label="Font-size Percent"> <option value="100%">100%</option> <option value="150%">150%</option> <option value="200%">200%</option> </optgroup> </select> </body> </html>
Attribute HTML <optgroup>
label
Attribut label dalam penggunaannya pada html
<optgroup>
berfungsi sebagai label atau judul dari element yang berada didalam element <optgroup>
itu sendiri.Contoh :
<select>
<optgroup label="Hoby Anda">
<option value="music">Musik</option>
<option value="olahraga">Olahraga</option>
<option value="membaca">Membaca</option>
</optgroup>
<optgroup label="Jumlah Saudara">
<option value="1">Satu</option>
<option value="2">Dua</option>
<option value="3">Tiga</option>
<option value="3-15">Lebih dari Tiga</option>
</optgroup>
</select>
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo Triksonic</title> </head> <body> <select> <optgroup label="Hoby Anda"> <option value="music">Musik</option> <option value="olahraga">Olahraga</option> <option value="membaca">Membaca</option> </optgroup> <optgroup label="Jumlah Saudara"> <option value="1">Satu</option> <option value="2">Dua</option> <option value="3">Tiga</option> <option value="3-15">Lebih dari Tiga</option> </optgroup> </select> </body> </html>
disabled
Attribute
disabled
jika digunakan pada html <optgroup>
maka element yang berada didalamnya akan menjadi tidak berfungsiAttribute ini bersifat boolean, yang artinya nilai atau value dari attribute ini bisa disebutkan maupun tidak
Contoh :
<select>
<optgroup label="Hoby Anda">
<option value="music">Musik</option>
<option value="olahraga">Olahraga</option>
<option value="membaca">Membaca</option>
</optgroup>
<optgroup label="Jumlah Saudara" disabled="disabled">
<option value="1">Satu</option>
<option value="2">Dua</option>
<option value="3">Tiga</option>
<option value="3-15">Lebih dari Tiga</option>
</optgroup>
</select>
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo Triksonic</title> </head> <body> <select> <optgroup label="Hoby Anda"> <option value="music">Musik</option> <option value="olahraga">Olahraga</option> <option value="membaca">Membaca</option> </optgroup> <optgroup label="Jumlah Saudara" disabled="disabled"> <option value="1">Satu</option> <option value="2">Dua</option> <option value="3">Tiga</option> <option value="3-15">Lebih dari Tiga</option> </optgroup> </select> <p> Pilihan untuk jumlah saudara, mempunyai sifat disabled </p> </body> </html>
Global Attributes:
Element
<optgroup>
mencakup Global Attributes HTML.
Event Attributes:
Element
<optgroup>
mencakup Event Attributes HTML.
Browser Support :
Chrome | Ya |
---|---|
Safari | Ya |
Firefox | Ya |
Opera | Ya |
IE | Ya |
Edge | Ya |
Default CSS :
Browser yang support dengan element
<optgroup>
, mempunyai nilai default :/* tidak ada */
Maksudnya tidak ada adalah tiap tiap browser akan membawa gaya tampilan sendiri-sendiri untuk element ini