CSS：三個背景圖像鏈接：浮動一個極左，一個極右，一箇中心？

我想用CSS建立一個導航佈局，進行了一系列博客文章，每一個都是一個卡通系列的一章：CSS：三個背景圖像鏈接：浮動一個極左，一個極右，一箇中心？

<div with 500px width>------------------------- 
----------------------------------------------- 
----------------------------------------------- 
<div> 
<<previous   +more    >>next 
</div> 
</div>

「上一個」，「下一個」和「多」都是空的div（但可以是跨度），寬度爲50px，應用背景圖像。他們鏈接到相關的地方。

我使用CSS精靈來創建漂亮的懸停效果，這也意味着我不能輕易改變每個鏈接的寬度而不會搞亂精靈。對於我的生活，我無法弄清楚如何設計三個div，讓'先前'漂浮在最左邊，'更多'漂浮中心，'下一個'漂浮右邊。

任何人都可以幫忙嗎？

謝謝。

來源

2011-01-19 AP257

什麼是網頁的一部分的HTML結構？ – 2011-01-19 18:41:04

已編輯澄清了一點，謝謝... – AP257 2011-01-19 18:48:40

你可以發佈頁面的該部分的實際HTML標記？或者在[JS Fiddle]（http://www.jsfiddle.net/）或[JS Bin]（http://jsbin.com/）上發佈演示，以便我們可以使用？ – 2011-01-19 19:00:38

可你剛纔定義的利潤率，因爲我承擔div容器將始終是500？

因此，像

<div style="width: 500px"> 
<div style="float: left;">Previous</div> 
<div style="float: left; margin-left: how ever many pixels it takes to center;">more</div> 
<div style="float: right;">Next</div> 
</div>

來源

2011-01-19 19:03:23 Zac

.previous { 
    width: 50px; 
    float: left; 
    background-position: left; 
} 
.more { 
    width: 400px; 
    float: left; 
    background-position: center; 
} 
.next { 
    width: 50px; 
    float: left; 
    background-position: right; 
}

來源

2011-01-19 18:39:33 scragz

CSS：三個背景圖像鏈接：浮動一個極左，一個極右，一箇中心？

回答

相關問題