The Basics
What is the great thing about CSS? Selectors. The fact that you can change the appearance of ALL paragraphs, links or any other element without having to retype the code everytime you want to do so. This is made possible by selectors. Here is an example of a Selector being used to change the colour of all paragraphs(<p>) to red:
p {
color:#990000;
}
Easy, right? Although most people limit themselves to this simple kind of selector, there are so many more you can use to make your life easier. Take for example multiple selectors, like this one:
b {
color:#999999;
text-decoration:underline;
}
strong {
color:#999999;
text-decoration:underline;
}
This selector will give those properties to ALL <b> and <strong> tags in the whole page. But why write the code twice? You can just replace it by something like this:
b, strong {
color:#999999;
text-decoration:underline;
}
Saves time and space, doesn’t it? Now what if you want to add a link color ONLY to links that are contained within a certain element, id or class. The here is your saviour:
#mainContent a{
color:#FFFFFF;
}
This will only give links the colour white which are within the #mainContent id. Of course you can replace #mainContent with whatever you like to. This also works for classes (.mainContent a) or also with other elements (blockquote a)