HTML p Tag – Paragraph Element

The main text that you see while browsing a website with a browser (Internet explorer, Chrome, Edge, etc.) is typically typed between the <p> opening tag and the </p> closing tag in HTML.

Become a Patron!

The <p> and </p> won’t show up  on the loaded website page like you see sometimes on this page. WordPress converts <p> to &lt;p&gt; and </p> to &lt;/p&gt; for me so that the browser knows that they aren’t elements. HTML elements don’t show up on the page, they just let the page know how to Display things.

  • To display <p> on a webpage, instead of using it as an element, type &lt;p&gt; instead.
  • To display </p> on a webpage, instead of using it as an element, type &lt;/p&gt; instead.

Positioning:

Right side.

Centered.

Left side.

Was made with the HTML….

<p style=”text-align: right;”>Right side.</p>
<p style=”text-align: center;”>Centered.</p>
<p style=”text-align: left;”>Left side.</p>

Adding color with CSS

Right side.

Centered.

Left side.

Was made with the following color hex values

<p style=”text-align: right;”><span style=”color: #ff0000;”>Right side.</span></p>
<p style=”text-align: center;”><span style=”color: #008000;”>Centered.</span></p>
<p style=”text-align: left;”><span style=”color: #0000ff;”>Left side.</span></p>


Whereas….

Right side.

Centered.

Left side.

Was made with the following color names….

<p style=”text-align: right;”><span style=”color: red;”>Right side.</span></p>
<p style=”text-align: center;”><span style=”color: green;”>Centered.</span></p>
<p style=”text-align: left;”><span style=”color: blue;”>Left side.</span></p>

Mark some text to highlight it:

If you have some important text that you want highlight, then you can add the mark tag around just that text.

  • Since I am using WordPress (with a plug in that lets me make pages with the classic set up), I usually do not have to include the p tags when I enter text in the visual tab or the text tab. To make the line above with the marked portion, I entered into the text tab…

If you have some <mark>important text that you want highlight</mark>, then you can add the mark tag around just that text.

Related topics to check out:

  • CSS: display

To support this site, check out the following links:

Home page

  • Information on this site is not guaranteed to be accurate. Always consult the manufacturer info/datasheet of parts you use. Research the proper safety precautions for everything you do.
  • Electronzap is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for sites to earn advertising fees by advertising and linking to amazon.com.