HTML5 fieldset Tag - GeeksforGeeks

17 Mar, 2022
The <fieldset> tag in HTML5 is used to make a group of related elements in the form, and it creates the box over the elements. The <fieldset> tag is new in HTML5. The <legend> tag is used to define the title for the child’s contents. The legend elements are the parent element. This tag is used to define the caption for the <fieldset> element.
Syntax:
<fieldset>Contents</fieldset>
Attribute:
disabled: It is used to specify that the group of related form elements is disabled. A disabled fieldset is un-clickable and unusable.
form: It is used to specify the one or more forms that the <fieldset> element belongs to.
name: It is used to specify the name for the Fieldset element.
autocomplete: It is used to specify that the fieldset has autocompleted on or off value.
Example: This simple example illustrates the use of the <fieldset> tag in order to make a group of related elements in the HTML Form.
HTML
<!DOCTYPE html><html><body>    <h1>GeeksforGeeks</h1>    <h2>HTML <fieldset> Tag</h2>    <form>        <div class="title">            Employee Personal Details:        </div>                 <!--HTML fieldset tag starts here-->        <fieldset>            <legend>Details:</legend>            Name:<input type="text">            Emp_Id:<input type="text">            Designation:<input type="text">               </fieldset>        <!--HTML fieldset tag ends here-->    </form></body></html>
Output:
HTML <fieldset> tag
Example: In this example, we will know the use of <fieldset> tag to make the group of related elements.
HTML
<!DOCTYPE html><html><body>    <h1>GeeksforGeeks</h1>    <h2>HTML <fieldset> Tag</h2>    <form>        <div class="title">          Suggest article for video:        </div>               <!--HTML fieldset tag starts here-->        <fieldset>            <legend>JAVA:</legend>            Title:<input type="text"><br>            Link:<input type="text"><br>            User ID:<input type="text">        </fieldset>        <!--HTML fieldset tag ends here-->         <br>               <!--HTML fieldset tag starts here-->        <fieldset>            <legend>PHP:</legend>            Title:<input type="text"><br>            Link:<input type="text"><br>            User ID:<input type="text">        </fieldset>        <!--HTML fieldset tag ends here-->    </form></body></html>
 Output:
<fieldset> tag to group the related element 
Supported Browsers:
Google Chrome 93.0 & above
Internet Explorer 11.0
Microsoft Edge 93.0
Firefox 92.0 & above
Safari 14.1
Opera 78.0
Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.
shubhamyadav4
bhaskargeeksforgeeks
HTML-Tags
HTML5
HTML
HTML
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Comments
Old Comments
Top 10 Projects For Beginners To Practice HTML and CSS Skills
How to insert spaces/tabs in text using HTML/CSS?
How to update Node.js and NPM to next version ?
How to set the default value for an HTML <select> element ?
How to set input type date in dd-mm-yyyy format using HTML ?
How to Insert Form Data into Database using PHP ?
Hide or show elements in HTML using display property
REST API (Introduction)
CSS to put icon inside an input element in a form
Form validation using HTML and JavaScript