In this short tutorial we'll see what CSS are and why everyone should use them.
CSS is the acronym for Cascading Style Sheets; the code of a Style Sheet is stored in a file with a .css extension
Cascading Style Sheets are used to define how your page will show up in the user's browser.
In the beginning, when internet was not what it's now, style was not so important and the priority was given to the content only.
Now that internet has evolved, and graphics and layouts has become fundmental elements, the look of your pages is 100 times more important than before, as if your visitors come to your site and find an ugly layout, they will leave your site as soon as they land on your home page.
A minor note: we often hate advertising banners....but remember that if now the web is this way me must thank mostly advertising...
Having a site styled with a CSS lets you save time and it makes easier and faster to change its style.
Just to let you know what I mean, this page, without any CSS attached, wouldn't look this way, the font would be the default one, it would be black, there wouldn't be bold fonts, the headings of the various sections would be blank with standard text in it, all the text would be aligned to left and so on...
Having a CSS you don't need to specify each cell height, or font style and your CSS, if well typed, will generally take care for your site layout.
This doesn't mean that you don't need HTML anymore, but your HTML code and your CSS will work together to show a nice looking page, saving you work and time.
CSS usage give your website a uniform aspect through the pages and makes it easy for you to mantain or update its look.
Despite you can use multiple CSS files I strongly recommend you to use only one for obvious semplicity and uniformity reasons.

How Cascading Style Sheets Work

As I said before, Cascading Style Sheets are stored in a separate file: this means that you can attach this file to all your pages. In the CSS file you will specify all the styles that you want your document to have; don't be afraid, in the beginning it seems that all this stuff is not worth but I can assure that if you spend a bit of time coding your CSS you will save hours and hours while creating new pages and new content for your website.
To attach a style sheet to your page (assuming that you named your style sheet "style.css") you must put this line into your HEAD section:
Basically in your CSS you decide how each element will look like, let's make some examples:
This specify a style for each paragrapher of your page:
The same thing can be done for the <td> elements in this way:
Obviously you might want to have different behaviours amongst your td tags in your page, here comes the moment to create classes...no worries, nothing difficult, it's done simply putting a dot in front of the element name; lat's say that we want some of our td tags to have a different text color and a bold and bigger font, this is the code to use:This code will work only inside td tags, and you will have to specify where you want it to work simply adding the class to the td declaration in your HTML code: Listing all the syntax elements here would make this tutorial unsurfable, for anything you might need related to CSS syntax you can go to w3schools.com, there you'll surely find the syntax of the element you need.