How to Use HTML Line Breaks
Line breaks are used in HTML when you want to move an element down to the next line on a page. For this example we will use two sets of three headings. The first set will have line breaks, and the second set will not have any line breaks so you can see the difference in space between the two. In this tutorial, you will learn how line breaks are used.
Here, we will creating multiple headings using the “h(1,2,3,4,5)” tags, and spacing using the line break.
While the bottom headings will be spaced, this is because the “h(1,2,3,4,5)” tags automatically move the next header to the following line. In this example, we are adding additional line breaks, the “br/” tags, which will create additional spacing for the headers.
<h1>These are elements with Line breaks:</h1>
<h1>These are elements without Line Breaks:</h1>
If you view this example in the browser, you’ll see that the sections have clearly defined header elements, and obvious spatial differences. Three line breaks have been inserted between each of the headers in the first set, so you could visibly see the difference in spacing. Each browser interprets line breaks differently so the space between breaks may vary slightly.
A Few Last Words
Nothing much to line breaks, however they add a more organized feel to your page say for example if you don’t want an image too close to your next paragraph or if you want a significant amount of space within a paragraph, etc. Join us next time for additional HTML tutorials!
Download Source Files