Using background-image in CSS

Go back to CSS Tutorial

<--R1C1-->

<--R1C2-->

<--R1C3-->

<--R2C1-->

<--R2C2-->

<--R2C3-->

<--R3C1-->

<--R3C2-->

<--R3C3-->

The following style sheet was used to create the background image effects in this page.

td { border: 1px solid gray; padding: 1em; }

table, h1 { border: 1px solid gray; }

body {
  background-image: url('silver.gif'); 
  background-repeat: repeat-y;
}

h1 {
  background-image: url('pink.gif'); 
  background-repeat: no-repeat; 
  background-position: 150px 50%;
}

table { 
  background-image: url('palegreen.gif'); 
}

.row {
  background-image: url('skyblue.gif');
}

.cell {
  background-image: url('paleyellow.gif'); 
}