Tutorial: External style sheets
Contents
1. Introduction & Tools
2. How external style sheets and html work together and what each does
3. Linking the html and the external style sheet
4. A bit about writing css in an external style sheet
5. Putting the css into the html code
6. Page body & page backgrounds
14. Container as rows or columns
18. Validating and checking the code
20. Working with backgrounds: single DIV background page
Setting up the css properties - page body
Inside Top Style (or your editor of choice), you can begin creating your page properties.
Below is an example of a page background:
body {
color: Black;
background-image: url(your-background-image.jpg);
}
This sets the color of the page, whether there is a background image on it. Margins can also be set here. The above example would create a page with a black background and your image as the page background.
One of the coolest things about css is how is lets you apply background images to the page body and choose how, or if, it repeats. This can't be done with html alone. Notice the "repeat" lines in the following examples.
body {
background-color: White;
background-image: url(daisy-bg.jpg);
background-repeat: repeat;
}
body {
background-color: White;
background-image: url(daisy-bg.jpg);
background-repeat: repeat-x;
}
body {
background-color: White;
background-image: url(daisy-bg.jpg);
background-repeat: repeat-y;
}
body {
background-color: White;
background-image: url(daisy-bg.jpg);
background-repeat: no-repeat;
}
Tutorial: External Style Sheets
www.anniemation.com
ALL IMAGES AND CONTENT COPYRIGHT 2011, ANNIEMATION
ANNIEMATION IS A REGISTERED TRADEMARK