html - div を含む別の画像内の CSS 画像

Question

テキストを作成しましたが、それを画像の中に入れたいです (繰り返しなし)。そして、それを中央の別の画像の中に配置したいと思います。両側だけでなく、4 つの側面すべてです。これがコードです。背景の大きな画像 (500x500)、前景の画像 (250x250)、不透明度のある前景の画像の上のテキストのようなものです。

CSS:

div.background
{
    width:500px; 
    height:500px;
    display:block;
    margin-left:auto;
    margin-right:auto;
    background-color:LimeGreen;
}

div.box
{
    margin:5px;
    width:250px;
    height:250px;
    background-color:white;
    border:5px dotted white;
    opacity:0.5;
}

HTML

    <div class="background">
        <div class="box">
            <p>image inside another image</p>
        <br />
    </div>

Answer 1

このようなもの？http://jsfiddle.net/eE7zV/1/