How to use the <br> Line Break Element in HTML
Table of Contents
HTML has a lot of useful tags that give you control over how your content is displayed.
One of these tags is the line break tag <br>
, which is used to create a line break in your content. This tag is useful when you want to create a line break in your content without using another tag like a new paragraph tag.
In this post, we will look at how to use the line break tag in HTML.
How to use the line break tag in HTML
As mentioned before, when you want to create a line break in your content without using any other block tags, you can use the line break tag <br>
.
This tag is rendered inline and forces the following content to be on a new line.
Let's first look at a line of text without a line break:
HTML<p>This is a line of text without a line break.</p>
That looks like this:
- HTML
Now let's add a line break <br>
tag inside this paragraph tag:
HTML<p>This is a line of text with a line break.<br>This is the second line of text.</p>
This renders like this:
- HTML
Notice how even though we didn't define a new paragraph tag, the second line of text is on a new line.
Keep in mind that you should not use the line break tag simply to add spacing between your content. Instead, you should use CSS, specifically margin, to add spacing between your content.
Another thing to keep in mind is that the tag is self-closing, so you don't need to close it with a closing tag.
Conclusion
In this post, we looked at how to use the line break tag in HTML.
Simply add the line break tag <br>
in between text to force the rest of the text to live on a new line.
- Getting Started with Svelte
- Getting Started with Electron
- Best Visual Studio Code Extensions for 2022
- How to build a Discord bot using TypeScript
- How to deploy a MySQL Server using Docker
- Getting Started with Sass
- Using Puppeteer and Jest for End-to-End Testing
- How to Scrape the Web using Node.js and Puppeteer
- Build a Real-Time Chat App with Node, Express, and Socket.io
- Learn how to build a Slack Bot using Node.js
- Using Push.js to Display Web Browser Notifications
- Getting Started with React