Basic HTML

Hyper-Text Markup Language (HTML) is the language used to format World-Wide Web pages.  The language consists of "tags" that precede and follow pieces of text, and these "start" and "end" tags tell Web-browsers how to present the text that appears between them.  Start tags just specify the tag-name, while end tags must have a slash (/) before the tag name.  For example, for a word to appear on you Web-page as bold, you need to precede it with the start bold tag and follow it with the end bold tag.  The tags themselves don't show up on the Web, but if they did, this is what it would look like:

This is normal text. <b>This is bold text. </b>  This is normal text again.

Here are some of the most common tags you will see and use on a Web-page:

TAG

NAME

FUNCTION

SAMPLE

<a...> ...  </a>

Anchor

anchors an internal or external link or destination

<a href="http...">...</a>

<b>...</b>

Bold

displays bold text

<b>This text is bold</b>

<blink> ... </blink>

Blink

displays blinking text
(Does not function with Internet Explorer)

<blink>Blinking text </blink>

<body> ... </body>

Body

contains document content (as opposed to <head>)

<br>

Line Break

start new line

<center> ... </center>

Center

centers text or element

<center>Middle</center>

<dl>

<dt>

<dd>

</dl>

Definition List

Definition Title

Definition Item

a list of two part items

the first part - the title

the second part - the item

<dl>
<dt>Title #1
 <dd>Item #1
<dt>Title #2
 <dd>Item #2
</dl>

<font> ... </font>

Font

describes font characteristics, e.g. color or typeface

<font size="+1">Bigger</font>

<font size="-1">Smaller</font>

<form> ... </form>

Form

contains fill-out form elements

<frame>

Frame

defines single frame in a frameset

<frameset>

Frameset

creates a framed web-page (used instead of <body> tag)

<h#> ... </h#>

Heading

contains text of heading size 1-6 where 1 is the largest and 6 is the smallest

<h3>

Size 3

</h3>

<head> ... </head>

Header

contains general information about the document, including <title>

<hr>

Horizontal Rule

creates beveled line from left to right margin - both height and width can be adjusted

<hr>

<html> ... </html>

HTML

brackets the contents of an entire hypertext document

<i> ... </i>

Italics

displays italicized text

<i>This is italic</i>

<img src="...">

Image

inserts an image file

<img src="duck.gif">

<li>

List Item

identifies an item in a list (<ul> or <ol>

<noframes>

No frames

contains alternate body for a framed document (for non-frame browsers)

<ol> ... </ol>

Ordered List

creates a number delineated list

<ol>
<li>1. Item
<li>2. Item
</ol>

<p>

Paragraph

inserts a blank line

<pre> ... </pre>

Preformated

contains text to be displayed EXACTLY as typed (usually in the Courier font)

<pre>

1_2_3_4_5_6_7
X   X       X
  X     X
      X     X

</pre>

<sub> ... </sub>

Subscript

displays subscript text

log<sub>10</sub> 7

<sup> ... </sup>

Superscript

displays superscript text

Y=X<sup>2</sup>

<table> ... </table>

Table

contains a table (the format of this handout approximates a table)

This

is

a

table

<td> ... </td>

Table Data

contains contents of one table cell

<title> ... </title>

Title

contains title of document (displayed in title bar of window)

<tr> ... </tr>

Table Row

creates a row in a table

<u> ... </u>

Underlined

displays underlined text

<u>This is underlined</u>

<ul> ... </ul>

Unordered List

creates a bullet delineated list

<ul>
<li>Item #1
<li>Item #2
</ul>

For more information on learning the basics of HTML, try this resource at Webmonkey.

 

Contact Us:
Email: tep@uoregon.edu, Phone: 541-346-2177 Fax: 541-346-2184
Teaching Effectiveness Program, Teaching and Learning Center, University of Oregon.
Last Modified: 04/07/11