Backgrounds with CSS
In CSS, there are many elements that can be given a background. For example, you can set a background to the page through the <body> tag, to a <div> or <span> tag, or even to an <a> tag. The CSS code would follow this format:
background-image: url(http://weelicious.com/wp-content/uploads/2009/04/broccoli-soup.jpg);
if it's an absolute link
or
background-image: url(images/bg.jpg);
for a document-relative path.
**Keep in mind that the path you name should be relative to the location of your CSS. That is, if your CSS is embedded within <style> tags in
the html file, the background-image property value should point from the html file to the image file. However, if your CSS is located on an external .css file, then the background-image property value should point from the css file to the image file.
Here's an example of some CSS which puts a background in a <div> tag:
div {background-image: url(images/firstDog.jpg);}
Note also that you can set a color as the property value instead of an image:
div {background: #33ff33;}
background-image: url(http://weelicious.com/wp-content/uploads/2009/04/broccoli-soup.jpg);
if it's an absolute link
or
background-image: url(images/bg.jpg);
for a document-relative path.
**Keep in mind that the path you name should be relative to the location of your CSS. That is, if your CSS is embedded within <style> tags in
the html file, the background-image property value should point from the html file to the image file. However, if your CSS is located on an external .css file, then the background-image property value should point from the css file to the image file.
Here's an example of some CSS which puts a background in a <div> tag:
div {background-image: url(images/firstDog.jpg);}
Note also that you can set a color as the property value instead of an image:
div {background: #33ff33;}
