HTML WEB DESIGN

 

separator-blank.png

 

GUIDE – TEXT ALTERING TAGS 2

 

 

CENTERED TEXT

 

  • Try using the <center> tag to add a heading at the top of your page.  For the heading to be at the top of your page’s content, it needs to appear first inside the body section.

 

<html>

<head>

   <title>My Page</title>

</head>

<body bgcolor="firebrick">

<font face="arial">

<center>My first HTML Document</center>

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>

 

 

 

H# TAGS

 

·       A quick way to resize text is to use the <h1> through to <h6> tags.  They simply resize the text.  Add an appropriate h# tag to your heading.  Use trial and error to see if h1 is best, or h2, or h3, or…

 

 

<html>

<head>

   <title>My Page</title>

</head>

<body bgcolor="firebrick">

<font face="arial">

<center><h2>My first HTML Document</h2></center>

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>

 

 

 

PARAGRAPHS

 

·       We can use the <p> tag to specify paragraphs.  Spacing between paragraphs will automatically be generated eliminating the need for the <br> tag. 

Try remove all the <br> tags and replacing them with <p> tags.  Note that you will not need a <p> between the lines anymore.

 

 

 

<html>

<head>

   <title>My Page</title>

</head>

<body bgcolor="firebrick">

<font face="arial">

<center><h2>My first HTML Document</h2></center>

 

<p>Mr. Campeau is <u>extremely</u> cool.</p>

 

<p>The <i>teacher</i> is <mark>very</mark> <b>smart</b>.</p>

 

<p>Camps is <font color="red">awesome</font>.</p>

 

<p>The guy at the front is so <font size="3">funny</font>.</p>

</font>

</body>

</html>

 

 

 

GOT EXTRA TIME?

 

·       Try using <sup> to see what this tag does to text.

 

·       Add this to your website:  a2 + b2 = c2

·       Try using <sub> to see what this tag does to text.

·       Add this to your website: H2O

·       Try using <del> to see what this tag does to text.

·       Add this to your website: Campeau is cool ok.

·       Try using <bdo dir=”rtl”> to see what this tab (and attribute) does to text.

·       Use the bdo tag above to add this to you site: !tseb eht si ybrekcoL