Ken Ward's Cascading
Style Sheets Tutorial

[Main Site Page: Freeing the Mind]
[Cascading Style Sheets: Contents]
[Previous: Selectors]
[This Page: Declarations]
[Next: Headings]

Declarations: The Body

We can look at a few declarations for the BODY selector and be pleased that these can be applied to other selectors as well. We can be more pleased to know we have already covered a number of them!

When we set properties for the body, we set properties which apply to the whole page (unless they are over-ridden by local formatting).

We could set properties for the page which specify the background image, the colour of the page, or the colour of the text (to name a few of them).

Background Colour

This is a page with these properties:

BODY { background-color: #0000ff;

color:#0000ff}

 

Padding

We can improve the look of the text by adding padding:

This is a page with these properties:

BODY { background-color: #00ff00;

color:#0000ff;

padding: 10px}

 

Margins

We can also make the text look less cramped by adding margins:

For, example, I am H1, but I am still blue.

(Because the code below applies to everything in body.)

This is a page with these properties:

BODY { background-color: rgb(00,255,00);

color: rgb(00,00,255);

padding: 10px;

margin-left: 15%;

margin-right: 15%}

/* Did you notice that the colour has been defined as an rgb colour, for a change? */

/* PS, I am in comments!*/

 

Changes made in the body affect all the elements in the body. If we add declarations to other elements we  make changes only in them.

Let's look at headings!

| Contents |