html

HTML New Line

“Today, we will be talking about another very useful HTML element. This HTML element helps you out whenever you wish to display your text in separate lines for any good reason. Yes, you guessed it right. In this tutorial, we will be talking about the new line character of HTML and its usage.”

The New Line Character in HTML

The “<br>” element or tag of HTML is used as a new line character. A new line is inserted right after the insertion of this HTML element. For example, you have the sentence “Have a good day.” If you introduce the HTML “<br>” element after “good,” then the specified sentence will be printed as follows:

Have a good

day

How to Insert New Line in an HTML Script?

You can learn the insertion of a new line in an HTML script by going through the following two examples:

Example # 1: Using the New Line Character for Making the Appearance of a Verse Clear

The new line character of HTML can be used in multiple scenarios; however, its most common usage is while creating web pages intended to display poetic content such as verses, etc. In this example, we will be using the new line character in HTML to beautify the appearance of a verse, i.e., each phrase of the verse will appear in a new line. This can be done with the help of the HTML script shown below:

In this example, we have used the HTML new line character, i.e., <br>, for separating each phrase of a verse for the sake of increasing its readability. After every phrase, we have made use of the <br> element of HTML, and we have enclosed this whole code within the paragraph tag.

Once we executed this HTML script with the Google Chrome browser, the following web page appeared on our screen. From here, you can see how nice our verse looks now.

Now, we will modify the very same script in a way that we will remove all the <br> tags from our HTML script while enclosing each phrase of the verse inside the paragraph tag as shown below:

The following web page depicts this modification. This is just another way of displaying the text in multiple lines; however, this method will introduce additional blank lines within your text. Therefore, if this is the kind of output that you want to get, then you are most welcome to use this method; otherwise, you should stick to the usage of the <br> HTML tag.

Example # 2: Using the New Line Character for Displaying Different Alphabets in Different Lines

This is just another example of using the new line character in HTML. In this example, we will be printing some English alphabet in multiple lines. The HTML script shown below displays the exact functionality as we have just explained it.

In this example, we simply wanted to have a web page that prints the first four English alphabets in one line, followed by the next four in a different line, and so on. Therefore, we have used the <br> tags at the intended points.

The following web page presents the specified English alphabet in the desired format:

Moreover, you can also use this HTML tag in other scenarios like printing an address in a specific format, etc.

Conclusion

This guide was designed to teach you the purpose and the usage of the new line character or the “<br>” tag of HTML. For this sake, after introducing you to this HTML element, we shared with you two very simple examples through which you will quickly be able to understand how the new line character can beautify the appearance of your text. It will not only make your text clear and readable, but it will also make it look more visually appealing. Therefore, you can use these two examples as a guideline for learning the usage of the new line character in HTML.

About the author

Ayesha Sajid

Ayesha Sajid has secured a Bachelor's degree in Computer Sciences and a Master's degree in Information Security. She is a technical content writer by profession who has around four years of experience in working with Windows and different flavors of the Linux operating system. She also has a keen interest in exploring the latest technology trends.