p Tags for Paragraphs

The paragraph tags are used to define a block of text as a paragraph. This HTML element is one of the basic HTML tags you should learn to use properly.

When a block of text is surrounded by the paragraph tags, the browser automatically adds white space before and after the paragraph.

Using the Paragraph Tag

To define a paragraph, you use the opening and closing paragraph set of tags. Prior to XHTML the closing paragraph tag was not required but it is now. Below is an example of how to code a paragraph.

The contents of the paragraph.

Notice in the example above that the paragraph tag is opened and closed. This is required for XHTML. Lower case is also required for XHTML.

If you are using a HTML editor in design view and hit the enter key to create space below the paragraph like this:

It is ignored by the browser therefore this is only bloating your code with unnecessary coding. Use a style applied to the paragraph if you want extra space after it or if this is what you want as the formatting for all paragraphs, apply some margin or padding to the p tag in your stylesheet.

Another thing some web coders and HTML editors do is a empty paragraph to create space like this:

nbsp;

Again, if you want space after the paragraph use your stylesheet instead of clogging up your coding with extra coding just for formatting.

You may notice that your HTML editor breaks up the content of your paragraph over several lines (known as source formatting).

The paragraph tag has a few basic attributes you should learn about to
start with.

Those line breaks are ignored by the browser. It just makes your coding easier to read.

Also, if you have extra spaces in between your words the browser ignores that also.

The width of your paragraph depends on the contents of the paragraph and if you have applied any specific styling to the paragraph tag. Generally, the contents flow with the width of the browser window. You can try it by grabbing the bottom right corner of your browser window with your mouse and moving it up and to the left. If you tried this you will see that the contents of this page adjusted with the size of the browser window.