Cascading style sheets

This is a very simple tutorial by someone who knows not a lot more - it's aimed at people trying to get started with css.

First of all, this page contains no style sheets of any kind - this means I have no idea what font you are seeing or how big. It depends on what you have set as your browser preferences, as well as which version of which browser you are using and to some extent whether you are using a Mac or a Windows machine.

I'm keeping everything very, very plain, partly so you can inspect the code of the page, and download each page if you like to examine it in Golive, without any extra confusing stuff being there. Also, you might want to print it out.

Some structure

Although there's no css here, I have used Header 1 for the title at the top (from the drop-down on the toolbar), and Header 2 for the sub-heading above. This means that even if you don't use css or someone's browser doesn't understand it they will see some emphasis for 'Some structure' and heavier emphasis for 'Cascading style sheets'.

h1, h2 etc. are understood by all browsers and they will make a paragraph labelled h1 etc. bigger, bold and with a space under it, but that's all you can guarantee - not the font, certainly not the exact size.

Now I've found a drop-down on the toolbar that's saying 'None' at the moment. For this paragraph I selected the text and chose '+1' - what do you see? It should be bigger but how much? I have no way of knowing.

Using css we can restore order by specifying how the text looks, and the best part is we can quickly and easily do this for an entire site in one go if we want, and just as easily change our minds.

So, let's get some control here .... next page.