EchoEcho.Com Homepage
Web Hosting - As Reliable As It Gets!
   Home > Tutorials > CSS > Introduction


 Tutorials 
 D-Zine Articles 
 Online Tools 
 Free Resources 
 References 
 Quiz 
 Hosting 

















  CSS TUTORIAL :
INTRODUCTION








CSS stands for Cascading Style Sheets. It is a way to divide the content from the layout on web pages.

How it works:

A style is a definition of fonts, colors, etc.

Each style has a unique name: a selector.

The selectors and their styles are defined in one place.

In your HTML contents you simply refer to the selectors whenever you want to activate a certain style.

For example:

Instead of defining fonts and colors each time you start a new table cell, you can define a style and then, simply refer to that style in your table cells.

Compare the following examples of a simple table:

Classic HTML
<table>

<tr><td bgcolor="#FFCC00" align="left"><font face="arial" size="2" color="red"><b>this is line 1</b></font></td></tr>

<tr><td bgcolor="#FFCC00" align="left"><font face="arial" size="2" color="red"><b>this is line 2</b></font></td></tr>

<tr><td bgcolor="#FFCC00" align="left"><font face="arial" size="2" color="red"><b>this is line 3</b></font></td></tr>

</table>


With CSS (assuming that a selector called subtext is defined)
<table>
<tr><td class="subtext">this is line 1</td></tr>
<tr><td class="subtext">this is line 2</td></tr>
<tr><td class="subtext">this is line 3</td></tr>
</table>


While CSS lets you separate the layout from the content, it also lets you define the layout much more powerfully than you could with classic HTML.




 << BACK TO MENU
READ MORE >>  
















DEVELOPER TIP!
FACT:
Most free graphic sites offer graphics that you can browse at random.
TIP:
Our online tool lets you select each of our 3000 graphics in any color you want.
And you can see how backgrounds, buttons and dividers work together at the same time.





     "Better Than Books - As Easy As It Gets!"


On EchoEcho: D-Zine Articles | Tutorials | Online Tools | Free Resources | References | Quiz | HostingAbout EchoEcho