The <br> br tag, short for “break,” is a handy little tool in HTML that lets you insert a line break within your text. It’s like pressing “Enter” on your keyboard, but specifically for moving text to the next line without starting a new paragraph.
br Tag <br>: The Line Break element
Here’s what the <br> tag does:
- Creates a Line Break: When you place a
<br>tag in your code, it tells the browser to move the text following it to the next line. This is useful for situations where you want more space between lines than a standard paragraph break would provide.
Example 1: Adding Space in a Poem
Let’s say you’re writing a poem on your webpage. You want each line to start on a new line, but you don’t want extra space between the verses (paragraphs). Here’s how <br> tags can help:
HTML
<h1>My Poem</h1>
<p>Roses are red,</p>
<br>
<p>Violets are blue,</p>
<br>
<p>Sugar is sweet,</p>
<br>
<p>And so are you!</p>
In this example, the <br> tags create line breaks after “red,” “blue,” and “sweet,” keeping the poem formatted correctly.
Example 2: Multi-line Address
Another common use of <br> tags is for addresses. You want each line of the address (street number, city, state, etc.) on a new line, but not separated by a paragraph break:
HTML
<p>123 Main Street<br>
Anytown, CA 12345</p>
Here, the <br> tag creates a line break after “Main Street” so the city and zip code appear on separate lines.
Things to Remember About <br>:
- It’s an empty tag, meaning it doesn’t have a closing tag like most HTML elements.
- It doesn’t add any extra space above or below the line break, just moves the text to the next line.
- While convenient for short breaks, it’s generally not recommended for creating large gaps between paragraphs. For that, use the
<p>tag for proper paragraph breaks.
By understanding the <br> tag, you can control your line breaks and add some extra formatting to your HTML content!
