Basic Tags

Paragraph Tags

Paragraph tags <p> are used at the beginning of each paragraph in the <body>. This tag skips a line before each paragraph or block of text. After you have written your text, don't forget to close your tag </p>.

Practice Session

Okay, let's try it. Open up a new Notepad file, and key in the following text inside your basic html format.

<p>We've been learning how to write basic html 
code in computer class. I have to say, this is so much 
easier than I thought it would be. I mean, most people 
want you to think that it requires a lot of intelligence, 
but really, you just have to follow directions. That said, 
what do I do next? </p>

<p>Oh yeah. I am supposed to save as 
"paragraphtags.html" in my web page folder, select 
"all files", and choose save. Then I am supposed to 
go back to the browser, go to File>open, and select
"paragraphtags.html" and open it up in the browser.
</p>

<p>If I don't see three separate paragraphs, I'm 
supposed to go back to my source code and hunt down 
any mistakes I may have made. If the problem isn't in the 
source code, then I must have saved the file incorrectly. 
Html is all in the details. </p>

You've learned how to do a lot of new things with html, and as you've seen, tags are just a different way of doing the same things you already learned how to do in Microsoft Word.

In-line Elements

What about bold and italics and all that fun stuff? Easy. Look at the chart of in-line elements below. Because they are in-line elemenets, they must be included in a block-level tag, such as your paragraph tag <p>.

Table of Inline HTML Elements
<strong> strong (bold) </strong>
<em> emphasis (italics) </em>

Practice Session

  1. Open a new Notepad file
  2. Copy and paste the amazing grace file into the new file
  3. Use the in-line elements listed above to "dress up" the text
  4. Use all elements at least once
  5. Don't forget to use closing tags on all of these elements
  6. Save as "amazinggracedressedup.html" and select "all files"
  7. Save into your web page folder

Line Breaks and Horizontal Rules

No, a line break isn't some new form of line dancing, and horizontal rules don't tell you how to play some new game. A line breaks forces a line return in your text, and a horizontal rule adds a horizontal line across the page. Since there isn't any text between the opening and closing tags, we can include them both at once.

Table of HTML Elements
<br /> line break, forces a line return
<hr /> horizontal line across the page

Practice Session

  1. Open up "amazinggrace.html".
  2. Copy and paste this file into a new file and save it as "elements.html"
  3. Put a line break after every other line.
  4. Put a horizontal line after each stanza.

Blockquotes and Quotes

We all know what quotes are. In html, you can use quotation marks around small quotes, just like you would in Microsoft Word. Blockquotes, however, are used for lengthy quotations that you want to highlight, such as a passage from a book. Notice the effect on this paragraph, which was coded as a blockquote. The code for this is <blockquote>text</blockquote>,and it is used just like a <p>.