Ecrire sur une image background-image

Bonjour,

Je voudrais écrire mon texte sur une image ( background-image: ) mais je n'arrive pas.

Comment faire ?

Voici mon code css.

body {
background-color: #ffffff;
margin:0px;
padding:0px;
}
.p {
margin:0px;
padding:0px;
font-size: inherit;
font-family: inherit;
font-weight: inherit;
text-align: inherit;
color: inherit;
line-height: inherit;
vertical-align: top;
}
p {
padding-top:0px;
margin-top:0px;
}
img {
border:0px;
}
div {
margin:0px;
padding:0px;
font-family:verdana; font-size:12px;
}
.AbsWrap {
width: 100%;
position: relative;
}
.rowWrap {
width: 100%;
}
.clearfloat {
clear:both;
height:0px;
}
a:link, a:visited{
COLOR:inherit;
text-decoration:inherit;
}
#main {

width:1008px;
margin: 0px auto 0px 0px;
border: 0px solid #f0f0f0;

}
#tete {
margin-left:0px;
margin-top:0px;
width:1008px;
height:222px;
margin-bottom:0px;
float:left;
display:inline;
background-image: url(images/tete.gif);
overflow:hidden;

}
#menu {
margin-left:0px;
margin-top:0px;
width:1008px;
height:78px;
margin-bottom:0px;
float:left;
display:inline;
background-image: url(images/menu.gif);
overflow:hidden;

}
#gauche {
margin-left:0px;
margin-top:0px;
width:210px;
height:833px;
margin-bottom:0px;
float:left;
display:inline;
background-image: url(images/gauche.gif);
overflow:hidden;

}
#centre {
margin-left:0px;
margin-top:0px;
width:585px;
height:833px;
margin-bottom:0px;
float:left;
display:inline;
background-image: url(images/centre.gif);
overflow:hidden;

}

#droite {
margin-left:0px;
margin-top:0px;
width:213px;
height:833px;
margin-bottom:0px;
float:left;
display:inline;
background-image: url(images/droite.gif);
overflow:hidden;

}
#pied {
margin-left:0px;
margin-top:0px;
width:1008px;
height:114px;
margin-bottom:0px;
float:left;
display:inline;
background-image: url(images/pied.gif);
overflow:hidden;
}

Merci d'avance.