rule-name: setting;

Here are some of the most useful rule names and the different settings that can be applied to them.

background-color. Lets you set a page’s background colour using HTML colours (they look like this: #123456).

color. Sets colours for text.

font-family. Lets you set fonts for your text – you can add more than one font name, separated by commas, in case your first choice is not available.

font-size. You can set the font size in px or em – it’s better to use em, as these measurements are relative rather than absolute.

width and height. Lets you specify the width and height of things. You can use px or percentages.

margin. The amount of space around the edges of some content. You can add -left, -right, -top and -bottom to margin to specify these margins individually.

padding. Works the same way as margin, but is for the space between the edges of the tag’s box and its content, instead of the space between the tag’s box and other boxes.

border. Puts borders around boxes. Takes three settings (width, type and colour), so you have to put spaces between them, like this: border: 1px solid black;

text-align. Lets you align text on the left or right, or in the centre (’center’).

text-decoration. Controls some text effects – mainly used to stop links from being underlined, like this: a { text-decoration: none; }

float. Tells content to float over other content, instead of starting underneath it on a new line. This is the tag most often used to simulate the kind of effects that you get with tables – floating a div and setting the main content area’s margin to its width is one of the easiest ways to create a sidebar, for example.