Web 101 - Class 1 - Tags, Tables, Images, Links, and Styles | Back to Class

Topic 1: Headings and Paragraphs

Heading Tag

<h1>Heading Tag</h1>

A paragraph tag can go on forever and it will wrap around the screen. It can contain multiple sentences. Fortunately, HTML takes care of all the word wrap for us. Notice that it uses the default fonts and colors and it's pretty plain.

<p>A paragraph...pretty plain.</p>

h2 heading is smaller than h1

<h2>h2 heading is smaller than h1</h2>

Topic 2: Tables, Rows and Cells

<table border="1" cellpadding="5">
<tr>
<td>Row 1 - Cell 1</td>
<td>Row 1 - Cell 2</td>
</tr>
<tr>
<td>Row 2 - Cell 1</td>
<td>Row 2 - Cell 2</td>
</tr>
</table>

Topic 3: Adding an Image

<img src="../images/ibeck.gif" alt="Image" width="109" height="17" border="0">

Topic 4: Adding an Link

<a href="http://www.bridge2u.com/main/leaders.php">Bridge Leaders (absolute)</a>

<a href="../chris/index.php">Chris Beck (relative)</a>

Topic 5: Adding CSS Style

<style>
p.Pretty {
color:blue;
font-size:125%;
background-color:yellow;
font-weight:bold;
padding: 2px 6px 2px 6px;
border: solid 1px gray;
}
</style>

My Pretty Paragraph

<p class="Pretty">My Pretty Paragraph</p>