The HTML <br> tag is a simple yet powerful element used to create line breaks within text on a webpage. Unlike paragraph tags, which separate blocks of text, the <br> tag inserts a break within a block of text, moving the content to the next line. This tag is particularly useful when you need to format text to display in a specific layout, such as addresses or poetry, without creating a new paragraph.
The <br> tag is self-closing and does not require a closing tag. It is a widely used element in HTML and helps improve the readability of content by separating text lines.
Syntax of the <br> Tag
The syntax of the <br> tag is straightforward and easy to implement. It does not need a closing tag because it is a self-closing element.
<br>
The <br> tag can be placed wherever you want to create a line break in your text. It’s typically used within paragraphs or other inline content.
Attributes of the <br> Tag
The HTML <br> tag does not have any specific attributes of its own, but it can support global attributes such as:
| Attribute | Description |
|---|---|
| class | Specifies one or more class names for styling. |
| id | Assigns a unique identifier to the tag. |
| style | Defines inline CSS for custom styling. |
| title | Provides additional information in a tooltip. |
| accesskey | Defines a keyboard shortcut for focusing the element. |
| tabindex | Sets the tab order for keyboard navigation. |
Although these global attributes aren't commonly used with the <br> tag, they can be useful for customization and accessibility purposes.
Examples of HTML <br> Tag
Example 1: Using <br> for Formatting Text
<!DOCTYPE html>
<html>
<head>
<title>Line Break Example</title>
</head>
<body>
<p>This is a paragraph of text.<br>Here is the next line in the same paragraph.</p>
</body>
</html>
In this example, the <br> tag creates a line break within the paragraph, so "Here is the next line in the same paragraph" appears on a new line without starting a new paragraph.
Example 2: Using <br> in Address Formatting
<!DOCTYPE html>
<html>
<head>
<title>Address Format Example</title>
</head>
<body>
<p>
John Doe<br>
123 Main St.<br>
Springfield, IL 62704<br>
USA
</p>
</body>
</html>
In this example, the <br> tag is used to format an address so that each line appears separately, mimicking the format of a traditional mailing address.
FAQs About HTML <br> Tag
Q1: What is the purpose of the HTML <br> tag?
A: The <br> tag is used to create a line break within text, allowing content to flow to the next line without starting a new paragraph.
Q2: Can I use the <br> tag to create multiple line breaks?
A: Yes, you can use multiple <br> tags consecutively to create multiple line breaks. For example, <br><br> will add two line breaks.
Q3: Is the <br> tag self-closing?
A: Yes, the <br> tag is a self-closing tag, meaning it does not require an ending tag like <br></br>.
Q4: Does the <br> tag support any attributes?
A: The <br> tag does not have its own attributes, but it can support global attributes such as class, id, and style.
Q5: When should I use the <br> tag instead of the <p> tag?
A: Use the <br> tag when you need to create a line break within a block of text, such as in poems, addresses, or form entries, without starting a new paragraph. The <p> tag should be used for separating blocks of content into distinct paragraphs.
