MCCC CIS 177 - Markup Languages

Lab 1. 3 Special Elements

1.29 Inserting a Graphic

Use <img> tagInline Images

Inline images are those that display directly in the Web page. External images require a plug-in for the user to view them. You'll learn more about external images as well as audio and video in the Mulimedia sessions. Here, you will insert an inline image using the <img> tag.

Add the following image to the chem.htm file. Replace the first two heading tags with the logo for the chemistry class. You can either use the image off the CD accompanying the text, copy it from the MCCC S: drive or download it by right-clicking on the image and saving it locally.

<body>
<h1 align="center">Mr. Dube's Chemistry Classes</h1>
<h2 align="center">At Robert Service High School</h2>

<p align="center"><img src="dube.jpg"></p>
1.31 Adding Special Characters
Use symbols & special charactersSymbols and Other Characters

Web designers commonly need to include special symbols and characters in their Web pages, which require special codes. Common codes are as follows.

Symbol Code Code Tag Description
©
&#169;
&copy;
Copyright
®
&#174;
&reg;
Registered trademard
·
&#183;
&middot;
Middle dot
º
&#186;
&ordm;
Masculine ordinal
&#153;
&trade;
Trademark
 
&#160;
&nbsp;
Non-breaking space
<
&#60;
&lt;
Less than
>
&#62;
&gt;
Greater than
&
&#38;
&amp;
Ampersand
1.32 Inserting Horizontal Lines
Use the <hr> tagHorizontal Rule Syntax

<hr align="align" size="size" width="width" color="color" noshade>

Where:

  • align = horizontal alignment: left, center or right
  • size = height in pixels or percentage
  • width = horizontal width in pixels or percentage
  • color = color in hex code or color term
  • noshade specifies the line should not be shaded

Continue with chem.htm and add a horizontal line below the logo image with no specified attribute values. Save and reload in the browser.

<p align="center"><img src="dube.jpg"></p>
<hr>