HTML Basics Tutorial 2 – HTML Paragraphs
Notes from the video ‘HTML Course Singapore | Learn HTML Programming |HTML Tutorial 2 -HTML Paragraphs’:
Each paragraph element begins with the start tag <p> and ends with the end tag </p>.
Between the start and end tags, we have the element content.
Let’s try typing in a paragraph element.
We keyed in the text Line 1 Line 2 Line 3 between the paragraph start and end tags with Line 1, Line 2 and Line 3 on separate lines.
Let’s display the webpage:
Notice that in the code we separated the text into three different lines, but the browser displays the text Line 1 Line 2 Line 3 on one line.
This is because in HTML we cannot change what’s displayed by adding extra spaces or extra lines in the code.
There are a few ways we can solve this problem:
If you want to display the text in separate paragraphs, you can enclose each paragraph with the paragraph tags.
For example, we can enclose line 1 with paragraph tags, line 2 with paragraph tags and also line 3 with paragraph tags.
Now the browser displays the text Line 1, Line 2, Line 3 in three separate paragraphs.
If you don’t want to create a new paragraph, you can create a line break using the line break element. The line break element creates a new line without starting a new paragraph.
We insert the line break element in the paragraph element.
Let’s try creating a line break for the text line 3.
The line break element begins with <br>. The line break element is an empty tag so there’s no end tag.
Now, the browser displays the text Line 1 as a separate paragraph from the text Line 2 and Line 3.
Line 2 and Line 3 exists in the same paragraph but in different lines.