Skip to content
Related Articles

Related Articles

HTML <optgroup> Tag
  • Difficulty Level : Basic
  • Last Updated : 02 Mar, 2021

This tag is used to create a group of the same category options in a drop-down list. The <optgroup> tag is required when there is a long list of the item exists.
Syntax:

<optgroup>
      <option>..</option>
        .
        .
</optgroup>

Attributes:

  • label: It is used to specify the label for an optgroup.
  • disabled: It is used to disable the option-group in a list.

Example 1: 

html




<!DOCTYPE html>
<html>
 
<body>
    <h1>GeeksforGeeks</h1>
    <h2>HTML optgroup Tag</h2>
    <select>
        <!-- optgroup tag starts -->
            <optgroup label="Programming Languages">
                <option value="C">C</option>
                <option value="C++">C++</option>
                <option value="Java">Java</option>
            </optgroup>
            <optgroup label="Scripting Language">
                <option value="JavaScript">JavaScript</option>
                <option value="PHP">PHP</option>
                <option value="Shell">Shell</option>
            </optgroup>
        <!-- optgroup tag ends     -->
        </select>
</body>
 
</html>


Output: 
 



Example 2: 

html




<!DOCTYPE html>
<html>
 
<body>
    <h1>GeeksforGeeks</h1>
    <h2>HTML optgroup Tag</h2>
    <select>
        <!-- optgroup tag starts -->
            <optgroup label="Programming Languages">
                <option value="C">C</option>
                <option value="C++">C++</option>
                <option value="Java">Java</option>
            </optgroup>
            <optgroup label="Scripting Language" disabled>
                <option value="JavaScript">JavaScript</option>
                <option value="PHP">PHP</option>
                <option value="Shell">Shell</option>
            </optgroup>
        <!-- optgroup tag ends -->
        </select>
</body>
 
</html>


Output: 
 

Supported Browser: 

  • Google Chrome
  • Internet Explorer
  • Firefox
  • Opera
  • Safari

full-stack-img

My Personal Notes arrow_drop_up
Recommended Articles
Page :