Repeating background image

When we talked about background colors, you were probably wondering about using an image instead. You can easily add a background to a whole page or to a div. Instead of using background-color, you use background-image. Let's just see an example:

Zombie Attack!

After background image it says "url", which stands for "uniform resource locator". That's just crazy technical speak for an internet location. Very similar to the "href" in a link. Either way, you don't change those letters, you just change the part in after it where it says 'zombie.jpg'. That's where you put the name of the image file that you want to use. By default, the image will repeat over and over to fill the page. It can be changed, but that's another lesson.

Just for fun, lets add a background image to the body, and a background image in a div. Like so:

Hideous right?

So my examples are really ugly. You can get much better background pattern images at these links:


Subtle Patterns


submit to reddit

More: CSSbackground-imagerepeat

Source: Seth | 2012-06-01

Recent Posts:

Repeating background image

Don't forget to comment your work

Layout your webpage using divs

Link it together

Images- the img tag