Friday, 10 August 2012

Presentational Tags:


Bold Text- The <b> Element:
Anything that appears in a <b>……</b>element is displayed in bold, like the word bold here:

<p>The Following word uses a <b>bold</b>typeface.</p>

This will produce following result:
The Following word uses a bold typeface.

Italic Text- The <i>Element:

Anything that appears in a <i>…..</i> element is displayed in italicized, like the word italicized here:
<p>The following word uses a <i>italicized</i>typeface</p>

This will produce following result:
The following word uses a italicized typeface

Underlined Text – The <u> Element:
Anything that appears in a <u>…..</u> element is displayed in italicized, like the word italicized here:
<p>The following word uses a <u>underlined</u>typeface</p>

This will produce following result:
The following word uses a underlined typeface

Strike Text – The <strike> Element:
Anything that appears in a <strike>…..</strike> element is displayed in italicized, like the word italicized here:
<p>The following word uses a <strike>strikethrough</strike>typeface</p>

This will produce following result:
The following word uses a strikethrough typeface

Monospaced font – The <tt> Element:

The content of a <tt> element is written in monospaced font. Most fonts are known as variable-width fonts because different letters are of different widths. In a monospaced font, each letter is the same width.

<p>The following word uses a <tt> monspaced</tt> typeface.</p>

Superscript Text – The <sup>Element:

The content of a <sup> element is written in superscript; the font size used is the same size as the characters surrounding it but is displayed half a characters height above the other characters.

<p>The following word uses a <sup>superscript</sup>typeface.</p>

This will produce following result:

The following word uses a superscript typeface.

Subscript Text – The <sub>Element:

The content of a <sub> element is written in subscript; the font size used is the same as the characters surrounding it, but is displayed half a characters height beneath the other characters.

<p>The following word uses a <sub>subscript<sub>typeface.</p>

This produce the following result:

The following word uses a subscript typeface.

Larger Text – The <big> Element:

The content of the <big> element is displayed one font size larger than the rest of the text surrounding it.

<p>The following word uses a <big>big</big>typeface.


Smaller Text – The <small> Element:

The content of the <small> element is displayed one font size smaller than the rest of the text surrounding it.

<p>The following word uses a <small>small</small> typeface.</p>


Grouping – The <div> and <span> Elements:

The <div> and <span> elements allow you to group together several elements to create sections or subsections of a page.

For example, you might want to put all of the footnotes on a page within a <div> element to indicate that all of the elements within that  all of the elements within that <div> element relate to the footnotes. You might then attach a style to this <div> element so that they appear using a special set of style rules.

The <div> element is used to group block-level elements together:

<div id = “menu” align = “middle” >
<a href = “/index.htm”>HOME</a> |
<a href = “/about/contact_us.htm”>CONTACT</a>
<a href = “/about/index.htm”>ABOUT</a>
</div>

<div id = “content” align=”left” bgcolor= “white” >
<h5>Content Articles</h5>
<p>Actual content goes here….</p>
</div>


This will produce following result:

                                                HOME |  CONTACT  | ABOUT
Content Articles
Actual content goes here…

The <span> element, on the other hand, can be used to  group inline elements only. So, if you had a part of a sentence or paragraph you wanted to group together you could use the <span style=”color:purple”>div tag </span> alongwith CSS </p></div>

This will produce following result:

This is the example of span tag and the div tag alongwith CSS.



No comments:

Post a Comment