قرار دادن متن روی عکس با استفاده از CSS

HTML
<div class="image">
  <img alt="" src="http://www.kavoir.com/img/text-over-image.jpg" />
  <div class="text">
    <p>This lovely image gladly demonstrates how I (this text) can be flying over her face.</p>
    <p>It's very kind of her but don't you agree that this place needs a camp fire and a little love?</p>
  </div>
</div>

CSS
.image {
position:relative; /*مهم!*/
float:left; /* اختیاری*/
}
.image .text {
position:absolute; /*مهم*/
top:10px; /* مشخص کردن موقعیت */
left:10px;
width:300px; /* اختیاری، اما داشته باشید بهتره */
}