CSS notes 3: Defining Backgrounds
syllabus | schedule | assignments | Web Resources | ARTC courses
[Intro]     [Tags]     [CSSStyles]     [Lists]     [Links]     [ImageTypes]     [Optimization]    [GlobalCSS]     [CSSBackgrounds]
[Tables]     [Slices]     [IR Rollovers]     [Animated GIFs]     [JS Rollovers]     [CSS Margins]     [Windows]     [Video]     [Metatags]     [Imagemaps]     [FormInput]     [FormAtttributes]    [AdvancedForms]    [WhatisJavaScript]    [Windows2]    [Windows3]    [BrowserInfo]    [StatusBar]    [Alerts]    [Randomness]    [Frames]    [iFrames]    [Frames2]   
Background Color:

background-color: #6600FF;

Ex: <BODY style="background-color: #6600FF;">

Background Image:

background-image: url('image location');

Ex: <BODY style="background-image: url('../images/bgimage.gif');">

Background Image - Repeat:

background-repeat: repeat-y; --repeat-x, no-repeat, repeat

Ex: <BODY style="background-repeat: repeat-y;">

Background Image - Position:

background-position: center; --top, bottom, left, right

Ex: <BODY style="background-position: center;">

Background Image - Attachment:

background-attachment: fixed; --scroll

Will the background stay fixed or scroll with the page

Ex: <BODY style="background-attachment: fixed;">

Lesson 6
1) Create a new html page and experiment with using the above CSS attributes.

Background Color
Background Image
              Background Image - Repeat on the Y
Position and repeat on the Y