<< .. Go to : : Home : : Exercise 1 : : Demo 1A : : Demo 1B : : Demo 1C : : Demo 1D : : TAGS : : All Class Demos .. >>

Exercise 1 Demo: Part C : Inline Elements

This is the HTML code you will need for Part C of Exercise 1.

Inline Elements add style to the text. They do not start a new line. They are physical style tags.

<html>
<head>
<title>
My First Web Page Part C </title>
</head>

<body>

Be sure to start your HTML document correctly, using the code above. Make sure your code is in lowercase.

This part of the demo covers Text Styles or Inline Elements. Use the following elements to enhance your text. Enclose the text you want enhanced inside a pair of these tags and see what happens. It can be a whole line of text or paragraph or just one letter.

The first two elements are used primarily for voice activated browser for the sight impaired, which is becoming an important issue. The way these elements is previewed varies depending on which browser you are using.

<em> This tag emphasizes text in some way. </em>

<strong> This tag also emphasizes text in some way. </strong>

The next set of tags enlarges or reduces the screen size of the text in relationship to the default font size set by the browser.

<big> This tag makes the type bigger. </big>

<small> This tag makes the type smaller. </small>


The next pair of tags are helpful if you are using mathematical formulas or chemical symbols on your page.

<sub> and </sub> is the pair of tags used for subscript.

<sup> and </sup> is the pair of tags used for superscript.

Here is some subscriptand here is some superscript.

If we want to write the chemical symbol for water we would write out H<sub>2</sub>O.
It would look like this : H2O

What if we write this... E=MC<sup>2</sup>. We end up with E=MC2

<code>
On (Release)
      Set Property ("target_item", Y Position) = 150
End on

</code>

The <blockquote></blockquote> element is used to set off a block of text from the rest of the information, and produces this result:

<blockquote>
"Practice makes perfect, but there's absolutely no fun in perfection. Discovery, exploration, and making mistakes -- that's where all the joy in life comes from. Give yourself some room to trip, stumble and fall."
</blockquote>

<tt>Typewriter Text makes text look like a typewriter (what's that?) typed it. </tt>

<pre>
Preformatted  text l o o k s  

   j u    s t  like  

Y
  O  
    U   typed it.   .   .   . .  .   . . . . .    . . 
</pre>

<address>

12345 Glen Haven
North County, CA 92111

</address>

<!--A comment looks like this - but it does not really show up on the page. Use it to write notes to yourself in your code. -->

Be sure to check out the NOBREAK tag down below. This tag will toast other formatting tags, so use it carefully. It is outside of the demo area because this tag would make this area (it is a table, covered in Exercise 6) very wide and cause it to run out of the browser window.

Always close your HTML documents correctly, using the tags below.

</body>

</html>

Remember, no content is ever included after you close these tags!!!!



Use the <nobr> </nobr> tags to enclose a long line of text which you never want to break regardless of what the browser wants to do. If you write a long line of copy it never seems to end. It just keep going on and on and on....

Notice how the text runs off the page? Be careful with this tag!

Go to Part D of Demo 1.

Back to Part B of Demo 1.

Back to Part A of Demo 1.

© Claudia Faulk. Created in 2008. Updated 1.10