HTML br Tag: Line Breaks

html br tag

The br tag adds a single line break in HTML. It is an empty tag that does not need a closing tag. Use it to break lines of text where needed.

How the <br> Tag Works in HTML

In forms or contact sections, <br> is useful for breaking text like addresses into readable lines.

Use <br> to format lines in poems or lyrics where each line starts on a new row.

Here is the tag:

<br>

It can be written with or without the closing slash (<br />). Both work in modern HTML.

Use <br> when a break occurs within the same paragraph or content block. If the content should be a separate idea or block, use <p> instead.

Here is a quick example:

<p>Line one<br>Line two</p>

This will show “Line one” followed by “Line two” on a new line inside the same paragraph.

Do not use <br> to create space between elements. Use CSS for layout and spacing to keep structure clean and accessible.

Browsers treat <br> as a newline without adding extra space like <p> or <div>. It creates a simple break within content flow.

Instead of using <br><br>, use CSS margin or padding for vertical spacing. It keeps content more semantic and cleaner to manage.

Examples

Break Address in Contact Info:

<address>
  John Doe<br>
  1234 Main St.<br>
  Anytown, USA
</address>

This example uses <br> inside the <address> tag to place each part of the address on a new line. It improves readability.

Multiline Form Label:

<label for="bio">
  Tell us about yourself:<br>
  (Max 500 characters)
</label>
<textarea id="bio"></textarea>

The <br> tag separates the main label from the note. This makes it easier to scan without using multiple label elements.

Formatting a Short Poem:

<p>
  Roses are red,<br>
  Violets are blue,<br>
  I write HTML,<br>
  And so do you.
</p>

This formats each line of the poem separately using <br>. Each line appears on a new row inside the same paragraph block.

Custom Signature in Emails:

<p>
  Regards,<br>
  <strong>Jane Smith</strong><br>
  Front-End Developer<br>
  [email protected]
</p>

This signature layout uses <br> to separate the name, title, and email. It keeps the structure in a single paragraph for styling.

Wrapping Up

In this article, you learned what the <br> tag does and how to use it in different situations like forms, poems, or contact info.
Here is a quick recap:

  • <br> adds a line break without a new block
  • It works inside inline or block-level elements
  • Avoid using it for layout — use CSS instead
  • Use it wisely to improve text flow where a new paragraph is not needed

FAQs

What is the purpose of the tag in HTML?

The <br> tag adds a line break in HTML. It lets content continue on a new line inside the same block. It does not create space like paragraphs.

How to add multiple line breaks using in HTML?

You can use multiple <br> tags in a row like this:
<p>Line 1<br><br>Line 2</p>
This adds extra vertical spacing between the lines, but it's better to use CSS for spacing.

Can I use the tag inside lists or tables?

Yes, you can use <br> inside <td>, <th>, or <li> elements. It breaks content within a cell or list item:
<li>Item A<br>Item B</li>

Is
the same as starting a new paragraph with

?

No. <br> only adds a line break. <p> starts a new block of text with default margin spacing. Use <br> for simple line breaks within content.

Similar Reads

How to Use HTML div Tag – Examples & Group Content

In this article, you will cover how to use div tag in HTML layout. It offers beginner to advanced code…

HTML Span Tag: Inline Container Explained

The HTML span tag acts as a simple container for inline text or other inline elements. It groups text and…

HTML template Tag: How it Works with Examples

The HTML <template> tag lets you store HTML content that won’t show up right away. JavaScript can pull it in…

HTML time Tag: Representing Dates and Times

The HTML time Tag marks time values in a document. Use it to show dates or times that machines and…

HTML Blockquote Tag: How to Create Quotes

The HTML blockquote tag defines a long quote from another source. It sets the quoted text apart from other content.…

HTML Footer Tag for Document Footers

The <footer> tag defines a footer section in HTML. It creates a clear endpoint for a page or section. Browsers…

HTML svg Tag: Scalable Vector Graphics for the Web

The <svg> tag in HTML helps you draw graphics that scale cleanly at any size. You can animate shapes and…

HTML style Tag: Inline CSS

The style tag in HTML defines CSS inside a web page. Click to see how it works with syntax and…

HTML wbr Tag: Word Break Opportunities

The <wbr> tag in HTML helps the browser decide where it can break a word. It does not force a…

HTML p Tag: How to Create a Paragraph in HTML

Paragraphs help group-related text. They build clear, readable pages. You use them to split ideas or topics. The HTML p…

Previous Article

HTML time Tag: Representing Dates and Times

Next Article

HTML hr Tag: Horizontal Rules

Write a Comment

Leave a Comment

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


Subscribe to Get Updates

Get the latest updates on Coding, Database, and Algorithms straight to your inbox.
No spam. Unsubscribe anytime.