HTML empty element

HTML Empty Element

An HTML element without content is called an empty element. <br />The empty element is closed within the opening tag ( ). But in HTML(5) it is okay to not close the empty tag. But if you want to do validation or read your document with an XML parser, then you must close all elements properly.
Element Description
<area> Sets the area of ​​the <map> tag.
<base> Specifies the base URL of all links used on the page.
<br> Breaks a line.
<col> <colgroup> is used to set columns in the element
<embed> Used to display embedded files, images, and plug-ins.
<hr> Creates horizontal lines to represent two sections separately.
<img> Used for displaying images.
<input> Creates an input field.
<keygen> What generator field creates.
<link> Adds an external stylesheet to the document.
<meta> Contains additional information about the document.
<param> Used to set parameters.
<source> Adds resources to the media element.
<track> Adds text tracks for media elements.
<wbr> Breaks at certain points in the word.
< br> Element

<br>The element is used to display a portion of a line on the next line or to provide a break between lines .

Example
				
					<!DOCTYPE html>
<html>
<head>
<title>HTML br Element</title>
</head>
<body>
<p>This is a paragraph.<br>It will appear on the next line.</p>
</body>
</html>
				
			
Output
HTML br Element

This is a paragraph.
It will appear on the next line.


element

<hr>Elements are used to separate two sections .

Example
				
					<!DOCTYPE html>
<html>
<head>
<title>HTML Example</title>
</head>
<body>

<div id="ez-toc-container" class="ez-toc-v2_0_74 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction">
<div class="ez-toc-title-container">
<p class="ez-toc-title" style="cursor:inherit">Table of Contents</p>
<span class="ez-toc-title-toggle"><a href="#" class="ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle" aria-label="Toggle Table of Content"><span class="ez-toc-js-icon-con"><span class=""><span class="eztoc-hide" style="display:none;">Toggle</span><span class="ez-toc-icon-toggle-span"><svg style="fill: #999;color:#999" xmlns="http://www.w3.org/2000/svg" class="list-377408" width="20px" height="20px" viewBox="0 0 24 24" fill="none"><path d="M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z" fill="currentColor"></path></svg><svg style="fill: #999;color:#999" class="arrow-unsorted-368013" xmlns="http://www.w3.org/2000/svg" width="10px" height="10px" viewBox="0 0 24 24" version="1.2" baseProfile="tiny"><path d="M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z"/></svg></span></span></span></a></span></div>
<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-1" href="#Document_Heading" >Document Heading</a></li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-2" href="#Document_Heading-2" >Document Heading</a></li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-3" href="#Document_Heading-3" >Document Heading</a></li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class="ez-toc-link ez-toc-heading-4" href="#Document_Heading-4" >Document Heading</a></li></ul></nav></div>
<h3><span class="ez-toc-section" id="Document_Heading"></span>Document Heading<span class="ez-toc-section-end"></span></h3>
<p>This is a paragraph.</p>
<hr>
<h3><span class="ez-toc-section" id="Document_Heading-2"></span>Document Heading<span class="ez-toc-section-end"></span></h3>
<p>This is a paragraph.</p>

</body>
</html>
				
			
Outpput
HTML Example

Document Heading

This is a paragraph.


Document Heading

This is a paragraph.

HTML Empty Element

5 Comments

  1. Love this blog! The content is always so relevant and insightful, keep up the great work!

  2. Your passion for what you do shines through in every post It’s truly inspiring to see someone doing what they love and excelling at it

    • Thank you so much! That really means a lot to me. I’m genuinely passionate about what I do, and knowing it resonates with others makes the journey even more fulfilling 🙌💙

Leave a Reply

Your email address will not be published. Required fields are marked *