|
HTML
WEB DESIGN
GUIDE – TEXT
ALTERING TAGS
BOLD, UNDERLINE, ITALICS &
HIGHLIGHTING
- Try placing a <b> tag
before a word and a </b> after that word. What happens?
|
<html>
<head>
<title>My Page</title>
</head>
<body bgcolor="lime">
Mr.
Campeau is extremely cool.<br>
<br>
The
teacher is very
<b>smart</b>.
</body>
</html>
|
- Try doing the same with <u>
tag. What does it do?
- Try doing the same with the <i> tag.
What does it do?
|
<html>
<head>
<title>My Page</title>
</head>
<body bgcolor="chocolate">
Mr.
Campeau is <u>extremely</u> cool.<br>
<br>
The <i>teacher</i>
is very <b>smart</b>.
</body>
</html>
|
- Try doing the same with the
<mark> tag. What does it
do?
|
<html>
<head>
<title>My Page</title>
</head>
<body bgcolor="chocolate">
Mr.
Campeau is <u>extremely</u> cool.<br>
<br>
The
<i>teacher</i>
is <mark>very</mark> <b>smart</b>.
</body>
</html>
|
THE FONT TAG
- On its own, the <font> tag
doesn’t do anything. You need to
make use of one of the attributes: color, size & face.
- The color attribute changes the
color of the font.
- The size attribute sets the size
of the font. It has a range of 1
to 7 only.
- The face attribute sets the font
name. Examples are Arial or
Times.
- Add a couple more sentences of
text so that we can have more area to work with. Test your page before continuing.
|
<html>
<head>
<title>My Page</title>
</head>
<body bgcolor="midnightblue">
Mr. Campeau is
<u>extremely</u> cool.<br>
<br>
The <i>teacher</i> is <mark>very</mark>
<b>smart</b>.<br>
<br>
Camps
is awesome.<br>
<br>
The
guy at the front is so funny.<br>
</body>
</html>
|
- Make one of the words on your page have a red
font. Make another have a font
size of 3. Try it!
|
<html>
<head>
<title>My Page</title>
</head>
<body bgcolor="lawngreen">
Mr. Campeau is
<u>extremely</u> cool.<br>
<br>
The <i>teacher</i> is <mark>very</mark> <b>smart</b>.<br>
<br>
Camps is <font color="red">awesome</font>.<br>
<br>
The guy at the
front is so <font size="3">funny</font>.<br>
</body>
</html>
|
- Make all of the text in your document be displayed
using arial font.
|
<html>
<head>
<title>My Page</title>
</head>
<body bgcolor="firebrick">
<font
face="arial">
Mr. Campeau is
<u>extremely</u> cool.<br>
<br>
The <i>teacher</i> is <mark>very</mark>
<b>smart</b>.<br>
<br>
Camps is <font
color="red">awesome</font>.<br>
<br>
The guy at the
front is so <font size="3">funny</font>.<br>
</font>
</body>
</html>
|
GOT EXTRA TIME?
Can you figure out how to make a single word be blue,
size 5 and of a specific font?
Hint: You can do this with
three different <font> tags or you can use just one.
Look up the <strong> tag and the <em> tag to see what they do. Try them out!
|