HTML <section> Tag
In this blog we will learn how to use HTML <section> Tag. The HTML <section> Tag is used to define sections in a document. When you place your content on a web page, it can include multiple chapters, headers, footers, or other sections on the web page, hence the use of the HTML <section> Tag.
HTML <section> Tag is a new tag introduced in HTML5.
Example:-
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML section tag</title>
</head>
<body>
<h1>This is HTML section Tag Example</h1>
<h2>Title 1</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat </p>
<h2>Title 2</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat </p>
<h2>Title 3</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat </p>
</body>
</html>Output:-
Table of Contents
Title 1
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat
Title 2
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat
Title 3
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat
HTML Select Tag
HTML <select> Tag
HTML <select> Tag is used to create a drop down list with multiple options. The <option> Tag is nested within the <select> Tag to define the options in the list.
Note:- If you want to send data to the server then use the <select> Tag within the element.
Example:-
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML select tag</title>
</head>
<body>
<h1>This is HTML select Tag Example</h1>
<form>
<label>Choose your Favorite city in India</label>
<select>
<option>New Delhi</option>
<option>Indore</option>
<option>Jaipur</option>
<option>Jodhpur</option>
<option>Chandigarh</option>
<option>Mumbai</option>
<option>Bengaluru</option>
<option>Lucknow</option>
<option>Amritsar</option>
</select>
</form>
</body>
</html>Output:-
HTML Small Tag
HTML <small> Tag
The HTML <small> Tag makes the text font one size smaller than the document’s base font size (such as large to medium, medium to small, etc.).
In HTML5, the <small> Tag is used to identify secondary importance such as copyright, side comments, and legal notices.
Note:- <small> Tag can be nested which means we can use <small> Tag multiple times inside each other, and it continues to reduce the font size compared to the text around it Will keep.
Example:-
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML small tag</title>
</head>
<body>
<h1>This is HTML small Tag Example</h1>
<p>This is some normal text.</p>
<p><small>This is some smaller text.</small></p>
</body>
</html>Output:-
This is some normal text.
This is some smaller text.
HTML Source Tag
HTML <source> Tag
The HTML <source> Tag is used to define more than one media resource for <audio> , <video> and <picture> Tags as child elements.
It is used to provide the same media content with different formats like mp3, mp4, etc…
When we embed multiple resources with same content but different format then browser can choose most compatible format and display or play that media file.
The <source> Tag was introduced in HTML5.
Example:-
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML source tag</title>
</head>
<body>
<h1>This is HTML source Tag Example</h1>
<video controls="controls" height="200" width="300">
<source src="flower.webm" type="video/webm" >
<source src="flower.mp4" type="video/mp4">
Your browser does not support the HTML5 video element.
</video>
</body>
</html>
