Web Hosting Directory | Web Hosting Resources | Webmaster Resources | Domain Tools | Search Engine Marketing | Forums
  Signup
Today: 1,244   Yesterday: 949   Max: 2,773   Total: 530,274   Current Users : 22 (Member 0) 
HTML RESOURCES

WEBMASTER RESOURCES

WEBMASTER TOOLS

JAVASCRIPT RESOURCES

PHP RESOURCES

MISCELLANEOUT RESOURCES

 

Break the <FONT ...> Habit: SPAN and DIV

Sometimes you want to set the font styles of a range of text without associating that text with a particular logical markup such as <EM> or <A ...>. In that case you'll find the <SPAN ...> and <DIV ...> tags handy. <SPAN ...> and <DIV ...> were specifically created to allow for the free form application of styles.

<SPAN ...> is a text-level element. It should only be used to set text within a paragraph. For example, suppose we want a range of text which is big and red. We could create a class like this (in a STYLE tag or in a style sheet file):

.bigred
{
font-size:30pt;
color:red;
font-weight:900;
}

Now we can apply the style to a span of text by setting its class to bigred:

Are you <SPAN CLASS="bigred">crazy?</SPAN>

which gives us this sentence: Are you crazy?

<DIV ...> is a block level element. It starts a new paragraph at the beginning and closes the paragraph at the end. Styles are applied to <DIV ...> in the same way as for <SPAN ...>: set the class using the CLASS class attribute. So, for example, we can use the same style rule as above and apply it to a <DIV ...> like this:

<DIV CLASS="bigred">
Be sure to disconnect socket A from plug B or severe damage will occur.
</DIV>

which gives us

Be sure to disconnect socket A from plug B or severe damage will occur.


Copyright 1997-2002 Idocs, Inc. Written by Miko Sullivan.

 
 
 
What is your major source of website traffic?
 
 
 
 
 
 

ADVERTISEMENT

 
Cheap Web HostingBudget Web HostingEcommerce Web Hosting
Link to UsLink ExchangeAdvertisePrivacy PolicyTerms Of ServiceAbout UsContact UsSitemap
Copyright © 2006 - 2009 Broadband Media, Inc. All rights reserved.