HTML hr tag

<hr> tag represents a break where a new topic starts within a section in a book. It is also used at the location of a scene change in a story.

By default, this is a thick line along x-axis. hr tag is being used in the following example to represent a topic transition.

Example

<section>
 <h1>Topics</h1>
  <h2>Topic 1</h2>
  <p>This is Topic 1 contained in the same section as the Topic 2. When this topic ends ,then we add horizontal role. This includes content centered on topic1.</p>
  
<hr>

  <h2>Topic 2</h2>
  <p>This is new topic contained in the same section as the Topic 1. This new topic contains the content after the horizontal role.This is another block of content centered on a particular topic.</p>
</section>	
Try </>

hr element can also be styled using CSS properties.

Example

<style>
hr{
 width:500px;
 color:green;
 height:50px;
 background-color:green;
}
</style>

Try</>

Tip: Remember that hr should be used within a section and not between the two sections.

Tag omission

It is a self closing tag (<hr />). In other words, there is no end tag.

Global Attributes

All the global attributes are applicable on the br element.



Was this article helpful?

 

Email:

Message:

Get the newsletter