CSS:CSS樣式如何?Logo立體盒子效果

讓我們看一下該如何?立體盒子的效果吧，然後，我們將會給大家展示一些很好的例子。
    準備先準備好你的頁面和圖片，我們使用這張圖片：
    我們簡單的將HTML寫成這樣:

<div id="container">
 <img id="logo" src="logo.png" alt="Lee Munroe"  />
</div>
    CSS樣式可能會是這個樣子的:

body{background:#999;}
 
#container{
 width:960px;
 background:#fff;
 margin:20px auto;
 padding:10px;
}
    下面是一個效果預覽：
    設定為相對定位，當我們定位logo的時候，我們希望它的位置是相對於容器的，因此使用相對定位：
#container{
width:960px;
background:#fff;
margin:20px auto;
padding:10px;
position:relative;
}
    將它定位到盒子的外面現在你需要做的就僅僅是定位logo，將其水平定位，讓它從容器中突出出來。

#logo{
position:absolute;
left:-15px;
}
    現在，我們就可以看到，logo已經顯示在盒子之外了。