HTML Paragraphs 📌


When we use a <p> tag, it will create a paragraph. Also it is a block element.


HTML Paragraphs

The HTML <p> defines a paragraph. It is a block element.

A paragraph always starts with a new line, and the browser will automatically add some white space before and after the paragraph.

Example:-

                
<p>This is a paragraph number one.</p>
<p>This is a paragraph number two.</p>
<p>This is a paragraph number three.</p>
                

Result:-

Screenshot

HTML Display

When it comes to display, You cannot arrange them using extra space or create a new line. In short, you can not do anything in this way.
BUT! Don't worry we will fix that up in our upcoming lectures. The is really a beautiful way to fix this. Not right now.

Example:-

                
<p> Lorem ipsum dolor sit amet consectetur adipisicing elit.
        Quo quas natus esse ea magnam expedita, neque eos illum molestias,
eaque, dolorem architecto explicabo tempora dolores saepe
                 eveniet aut quam adipisci.
</p>

                
<p> 
    Lorem ipsum dolor sit amet             consectetur adipisicing elit.
    Quo quas natus esse ea magnam   expedita, neque eos illum molestias,
    eaque, dolorem            architecto explicabo tempora dolores saepe
    eveniet aut quam                                            adipisci.
</p>

Info:- As you can see we create two paragraphs with a different styles. What did you think, What web page will display?

Result:-

Screenshot

HTML Line Breaks

We use <br> element to create a line break.

Example:-

                
<p>This is a <br> paragraph with <br> with line breaks.</p>
            

Result:-

Screenshot

Let's talk about Poem

Some time we need right some poem to display.
But if you doing in previous way then it will not work.

Screenshot

Now question how we will create this. Without using <br> tag

Solution:-

We need to use <pre> for this.

                
<pre>
    Thou hast made me endless, such is thy pleasure. This frail vessel thou emptiest again and again, and fillest it ever with fresh life.

    This little flute of a reed thou hast carried over hills and dales, and hast breathed through it melodies eternally new.

    At the immortal touch of thy hands my little heart loses its limits in joy and gives birth to utterance ineffable.

    Thy infinite gifts come to me only on these very small hands of mine. Ages pass, and still thou pourest, and still there is room to fill.
</pre>
            

Tag Reference

Tag Description
<p> Defines a paragraph
<br> Inserts a single line break
<pre> Defines pre-formatted text