HTML <section> tag
The section element in HTML is used to define sections in a document.
Syntax of Section Tag:
<body>
<h1>……….</h1>
<section>
<h2>……….</h2>
<p> …………………………</p>
</section>
<section>
<h2>………..</h2>
<p>…………………………. <p>
</section>
</body>Examples of Section Tag
Example 1:
In this example, we use the HTML "section" element for defining the two sections on the web page:
<!DOCTYPE html>
<html>
<head>
<title> html section tag </title>
</head>
<body>
<h1> here is the section tag example </h1>
<section>
<h2> preview of this document data part-1 </h2>
<p> Lorem, ipsum dolor sitametconsecteturadipisicingelit. Natus, reprehenderitea rerum eaquequidemut
exercitationemullamvelit dolor modi! Ducimusmagniiure autem itaquepraesentiumrepellendusnecessitatibus
dignissimos at!
</p>
</section>
<section>
<h2> preview of this document data part-2 </h2>
<p> Lorem ipsum, dolor sitametconsecteturadipisicingelit. Aliquam hic dignissimos vitae error alias dolor
magniinventore quo temporibusrepudiandae. Exercitationemducimus fugit iure. Nesciuntatqueiustomagni ad
aliquid?
</p>
</section>
</body>
</html>Output:
Example 2:
Here, we are going to declare three sections in a html document with the help of html section tag:
<!DOCTYPE html>
<html>
<head>
<title> html section tag </title>
</head>
<body>
<h1> here is the section tag example </h1>
<section>
Lorem ipsum dolor sit ametconsecteturadipisicingelit. Deserunt, exercitationem hic. Doloremquevoluptasmodi, consequunturquidempariaturinciduntreprehenderitenim delectus. Praesentiumnequeexcepturiearumharumillo ad.
</section>
<section>
Lorem ipsum dolor sit ametconsecteturadipisicingelit. Est, saepe in. Impedit vel natus, asperiores, doloremaliquamblanditiisvoluptas, nostrum rationeharum error ipsam sed consequatur rerum doloribusnesciuntaccusantium.
</section>
<section>
Lorem ipsum dolor sit ametconsecteturadipisicingelit. Alias dicta quos estquaeratmodi, nobis mollitiavoluptatibus! Eumharumeaquecupiditatequia, pariaturblanditiis at, quis illum alias veniamquaerat?
</section>
</body>
</html>Output:
Example 3:
Here, we are going to declare one section in a html document with the help of html section tag:
<!DOCTYPE html>
<html>
<head>
<title> html section tag </title>
</head>
<body>
<h1> here is the section tag example </h1>
<section>
<h2> preview of this document data part-1 </h2>
<p> Definition and Usage
For defining section in html document, we use the <section> tag in html.
Example
Example 1:
Here, in this example we are going to declare two sections in a html document with the help of html <section> tag: </p>
</section>
</body>
</html>Output:
Browser support:
List of browsers that support html section tag are mentioned below:
Chrome: Yes – version 5 needed
Microsoft Edge: Yes– version 12 needed
Firefox: Yes– version 4 needed
Safari: Yes– version 5 needed
Opera: Yes– version 11.1 needed
Default CSS Settings
The following CSS values are saved as default in most of the browsers for defining the section tag:
Example
section {
display: block;
}