Theory
Theory
Comments

The p tag for paragraphs

You can create the basic structure for the text using headings. The finer structure can be specified using paragraphs. The tag <p> (which stands for “paragraph”) is used to mark up paragraphs.

By default, browsers separate paragraphs from surrounding content with top and bottom margins (which you can change with CSS). So, if you need to separate one block of text from another, the right decision would be to enclose them in <p> tags.

<p>A paragraph about how I decided to become a coder</p>
<p>A paragraph about my instructor</p>
<p>A paragraph about my blog</p>

Let’s now mark up the introductory text on our main webpage using paragraphs.

A paragraph usually groups sentences about a common theme. In HTML, the <p> element represents a paragraph.

HTML also defines paragraphs as runs of phrasing content. Such runs can occur without a <p> element, but using <p> explicitly marks the paragraph and gives it meaning in the document.

The <p> tag lets us explicitly mark paragraphs that group elements with phrasing content. These paragraphs can contain not only text, but also images, links or input fields, for example.

Not all tags can be nested within <p>. For example, major structural tags, headings, forms, lists and tables cannot be placed inside a paragraph. When your browser encounters an inappropriate tag inside <p>, it will automatically close the <p>, then display the inappropriate tag, followed by the remainder of the paragraph but without a surrounding tag, and then it will insert an empty <p> before the </p> that you wrote.

index.html

HTML

<!DOCTYPE html> <html lang="en"> <head> <title>The website of a beginning coder</title> <link rel="stylesheet" href="outlines.css"> </head> <body> <header> <h1>The website of a beginning coder</h1> </header> <main> <nav> Navigation </nav> <section> Greetings to everyone! Welcome to my first site. Up until just recently I had no idea what a coder does for a living, but now I have found interactive courses in HTML and CSS and I have set myself the goal of becoming one. I was even assigned an instructor, Muffin, who won’t let me slack off and will track my progress. My first assignment is to keep a diary and honestly write about all of my accomplishments. </section> <section> Skills section </section> </main> <footer> Website footer </footer> </body> </html>

Goalscompleted

Break the text in the first “section” into two paragraphs.

The first paragraph should consist of the text that starts with the phrase Greetings to everyone! and ends with the words my progress,
The second paragraph should contain the remaining sentence: My first assignment … accomplishments.

The p tag for paragraphs

Comments

Log in

Sign up

Restore access