CSS is one of the more obscure sets of initials confronting the newcomer to website building: FTP, HTML, CSS. The initials CSS stand for ‘Cascading Style Sheets’ though quite why the originators of the internet chose to make such an obscure expression for a simple concept is beyond me.
It all becomes very clear then we split up the phrase:
Style Sheets
Style sheets do what it says on the box: they set the style of your web page. They are site-wide; that is they apply equally to every page on your site so that you don’t need to set up the styling for every page on your site.
The style sheet fixes the width and number of columns, the background colours, the size and font of your text etc.
Cascading
Cascading refers to the sequence in which style sheets – if there is more than one – are read and the priority given when two or more styles seem to clash. In general the latest comes first. This allows you to over-ride the standards set up by your Site Building software, either universally or locally.
CSS and HTML
Though there is a significant overlap you should see CSS as the general directing the war, whilst HTML is the sergeant in the trenches deciding in his local area who does what and when.
Finding you CSS Files
You can use your FTP Client software – either a free open source software package like Filezilla, or the one provided by your Internet Host as part of your package, to find your CSS files: they will be called “something.css” very often ‘style.css. They may be in a directory called CSS or, in the case of a CMS application in the ‘Themes’ directory. If you open – but do not change – the file you will find a long series of commands inside. There are two basic groups:
1. Those proceeded by a ‘#’ which define ‘ids’
2. Those proceeded by a ‘.’ which define ‘classes’.
You can change the ‘class’ on a web page as often as you like but the ‘id’ only once so you – or your Site Building software – will use the ‘id’ function to set up the generalities of the page and ‘classes’ to make more localised changes.
Creating a Local.css file.
I always find it best not to mess with existing.css files put in place by the by the Site Building software of the theme except to put in one additional line:
@import “local.css”;
You can then create a new CSS file in the same directory called “local.css”. As that file will be newer than the existing CSS files the browser will use it first in the event of a conflict.
More to follow.
