Make your HTML pretty! CSS overview
Posted on | February 26, 2010 | No Comments
At the end of last session, we began looking at CSS (or Cascading Style Sheets) – the best way to layout and ‘style’ or format your html page.
Think of your HTML as the ‘guts’ the content, the information of your page or site.
The CSS is the style, the class, the colours, fonts, layout and glue to bind it together.
The HTML and CSS then get read by the browser and out comes a beautiful website!

First off, create a new file in your html editor of choice (see this post for more information on that) and call it style.css You could call it anything you want really, but it must have a .css file extension. save this in the same ‘root’ folder or directory as your html files.
Add this code in between the <head> tags in your html like so:
<head>
<title>the title of your page</title>
<link rel=”stylesheet” href=”style.css” media=”screen,projection” type=”text/css” />
</head>
They are now linked together. Now you can add CSS styles in your CSS file and create classes and ID’s in your html file and the magic will happen.
I will continue this in class on Monday, but in the meantime, please look at the CSS Zen Garden and the W3Schools CSS lessons
This site also look like it could be useful (free templates too)
Comments
Leave a Reply