What is CSS -Cascading Style Sheets, do I need it?

So, what is CSS and how does it fit into your web page?

The early versions of HTML, up to version 4, had their own way of presenting the webpage content. Your browser could show the text no problem, but you needed extra tags to make the text presentable. Tags like <font face="verdana" color="blue" size="3">This shows Verdana font in a blue color with relative size of 3 out of 7</font>
Or tags like <u>This underlines your text</u> and <s>For strikethrough text</s>
These tags above are now all deprecated (not to be used anymore, but most browsers can still read it) in HTML 4 and 5.

Other tags like <hr> for horizontal rule, <p> for paragraph, <i> for italic text and others are still in use. but the content of the webpage got somehow lost in all these tags and the W3C added style sheets to their standards for later versions of HTML.
So now you write the formatting and page layout stuff of your page in a seperate file, or in the webpage itself and point your content to it. The beauty about writing it as a seperate file is that if you have 101 pages and you want to change the font, you only have to do it ONCE in this CSS file (usually called style.css).

What is CSS usefull for otherwise? Cascading Style Sheets give you control to make all your webpages consistent with each other. Why Cascading? Where is the waterfall? Cascading is extra powerful tool for the web developer to create a precendence (order) for your browser to apply the styles. The style in a sheet with high importance get applied first. Don't worry about cascading now, it may become usefull once you get into serious web design.

Below is an example of a style in a page in this website.

Stylesheet example

Further down this web page with the above style code is the following heading for the top of the page;
<h2>What is your web business category, what works for you?</h2>
The style sheet above defines h2 as h2 { font-size:22px; } which will give my heading a pixel size of 22.

Right click on your website and click on 'View page source' and you may spot your in-page style, or a pointer to your external style sheet.

Navigation

There are even more pages hiding behind the buttons you see down here. Grab a cuppa and a bikkie and get comfortable.

Quick Links

Various Videos

Videos
Short videos

Retirees

Retirees
Retirees

Local business

Local Business
Local business

Work at home

work-at-home
Work at home

eLearning NEW!!

eLearning
eLearning