| color: |
color: red color: #FFOOOO color: rgb(255,0,0) |
| background-attachment: | background-attachment: fixed |
| background-color: |
background-color: green (will only change the colour of the element it is applied to) background-color: #00FF00 background-color: rgb(0,255,0) |
| background-image: | background-image: url(myimage.gif) |
| background-position: |
background-position: center left background-position: 25% 75% |
| background-repeat: |
background-repeat: no-repeat (values: repeat, repeat-y) background-repeat: repeat-x |
| background: |
background: silver url(myimage.gif) no-repeat background: url(myimage.gif) no-repeat fixed center |
Example - use an image to create a water-mark effect :-
BODY{background: url(image/imageName.gif) center no-repeat fixed}
I have tried this effect on this page, with limited success. Netscape v4.75 hates the above example. When trying to use each property individually, I found that it ignores the background-position property. It works in IE, though.