Simply Maya User Community - View Single Post - Dreamweaver & CSS help/tutorials.

CSS compliments HTML it does not replace it entirely. CSS gives you more control over how the page is rendered, it also removes the need for a lot of redundant HTML code. Example:
Straight HTML

Code:

<font color="#000066" size="-1" face="Verdana, Arial, Helvetica, sans-serif">Line 1</font><br>
<font color="#000066" size="-1" face="Verdana, Arial, Helvetica, sans-serif">Line 2</font><br>
<font color="#000066" size="-1" face="Verdana, Arial, Helvetica, sans-serif">Line 3</font>

The above is 3 lines of text with font attributes specified in HTML now imagine that throughout an entire site and you can see what i mean about redundancy, not only that but if you need to come back and change the font type or size at a later date its a pain in the ass.

Heres the same thing in HTML using CSS

Code:

<style type="text/css">
<!--
.medium-text-example {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000066;
}
-->
</style>
</head>

<body>
<div align="left" class="medium-text-example">Line 1</div>
<div align="left" class="medium-text-example">Line 2</div>
<div align="left" class="medium-text-example">Line 3</div>

Now you can update all the text on that page, by simply changing the properties of .medium-text-example. If you save your CSS as its own file and link it to all the pages in your site like so

Code:

<link href="/main.css" rel="stylesheet" type="text/css">

When you update the CSS file the entire site will change.

You may also redefine entire HTML tags with CSS, say you wanted to use Verdana throughout all the text in your site, with out the need to apply styles to every scrap of text this does so

Code:

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

Or how about Verdana for the body text, and Times New Roman for all the table cells. Also simple.

Code:

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
td {
	font-family: "Times New Roman", Times, serif;
}

This will save you a lot of work when it comes to designing and updating your site.

Try a search for CSS basics on google you will turn up loads of material. The above examples should give you enough incentive to want to go look it up.

Forget rollover images, as for frames they can come in handy in certain circumstances but in 100s of designs I've probably made one page that uses them. Try if possible to get your site done without them, same goes for iframes and such, only use them if you have to.

David user added image