讓我們看一下該如何實現立體盒子的效果吧，然後，我們將會給大家展示一些很好的例子。
准備先准備好你的頁面和圖片，我們使用這張圖片：
我們簡單的將HTML寫成這樣:
<div id="container">
<img id="logo" src="logo.png" alt="Lee Munroe" />
</div>
CSS樣式可能會是這個樣子的:
body{background:#999;} #logo{
#container{
width:960px;
background:#fff;
margin:20px auto;
padding:10px;
}
下面是一個效果預覽：
設置為相對定位，當我們定位logo的時候，我們希望它的位置是相對於容器的，因此使用相對定位：
#container{
width:960px;
background:#fff;
margin:20px auto;
padding:10px;
position:relative;
}
將它定位到盒子的外面現在你需要做的就僅僅是定位logo，將其水平定位，讓它從容器中突出出來。
position:absolute;
left:-15px;
}
現在，我們就可以看到，logo已經顯示在盒子之外了。