CSS - Cascading Style Sheets - Understanding CSS

CSS described in really simple terms. This article assumes no prior knowledge and by the end of it you should understand what CSS means

CSS stands for Cascading Style Sheet.

Let’s worry about the second part of that phrase first. A Style Sheet is just some text that styles something.

CSS styles web pages. That means it will describe things like the colour of the background, the width of the space allowed for the writing, and even things like the style of the writing. These are CSS rules.

Without CSS most websites should still work but they would look very boring.

The “Cascading” part of CSS just means that the properties that CSS describe can fall down to lower levels.

This means that you can say “make all text in this area blue”, and then you can specify a rule further down the cascade that says “make this bit of text red”, all the text would be blue except for the specific thing we asked to be red.

Example

An example of the CSS we talked about could be;

body {
color: blue;
}

.warning {
color: red;
}

This will turn all text within your main body (all of the page) blue, but if we have an element with the class of warning then the colour will be red.

This is part of our Simple CS series, where we explain Computer Science and Web Development terms in really simple language. Excellent for beginners or if you need a quick refresher.

Access to the series is completely free, if you have found it useful we would really appreciate it if you could let people know about the project.

If there is a term you would like me to cover please drop us an email.

Recent posts View all

Web DevProductivity

Keeping on top of website updates

Learn what website updates are, what they entail, why they are important, and how we can help

Freelancing

Getting the most out of your agency

Here are some tips based on years of working with, for, and as an agency on how to get the most out of any work you do.