Selectors and Declarations

When using CSS either in your stylesheet or defined inside <style></style> tags there are 2 basic things you need to learn.

Selectors

Let’s examine a very basic and very short CSS file.

h1 {
color:#ffff00;
border-bottom:1px solid #ccc;
}

This code gives all h1 tags a 1 pixel bottom grey border, and makes the text yellow. The h1 is the selector. This is what we’re telling the browser to change the styles for.

Declatations

Once we have selected something (using the selector) then we must tell it what to change. All elements have a default style which is more or less identical across all browsers. Again, using the dame example as before the color:#ffff00; is a declaration, as too is border-bottom:1px solid #ccc.

So to summarise, selectors tell the browser what to edit, and the declarations tell the browser what to edit to. Everything inside the curly braces ({ }) can generally be considered a series of declarations, with a couple of very rare and minors exceptions.