佈局問題，部分固定寬度，部分彈性

我已經有過一些帖子一看，並沒有找到我後。我現在正在PS中設計一些東西，當涉及到將設計編碼爲html + css時，我可以預見到一個問題。佈局問題，部分固定寬度，部分彈性

想象一下，我中心格，這是960px。它將有一個半透明的.png作爲背景。該設計是這樣「full width」這個div將被包含在一個更大的div，設定爲100％的寬度。這一切都好，直到我在這個外部div的背景。它也將有一個.png運行整個頁面的寬度。問題是：我不希望它穿過中間，因爲它會導致中間有一個雙重厚度，如果這是有道理的？！

基本上，我需要一種方法來運行彈性的任一側的div，或者某種程度上阻止背景穿過瀏覽器窗口的中心部分運行。

我不知道如何可以做到這一點，除了使用JS設置寬度，我真的不希望這樣做。

任何想法？

好吧，我試圖讓這裏的基本問題：http://jsfiddle.net/8Bznc/1/

來源

2011-12-10 Dan

爲什麼你需要透明背景？ – PeeHaa

因爲這一切背後的背景是紋理，我想部分通過堆疊在 – Dan

應用background-image只對包裝div。

或者，如果中心和邊需要有不同的圖像，請將中心div也設爲非透明background-color。

此外，您可以僞造它通過使用多個background-images。 Demo

請記住，這不會在老版本的IE瀏覽器中工作，但作爲非必要的東西作爲背景透明度可以作爲優雅降級例外。

來源

2011-12-10 21:45:26 bookcasey

我不認爲這會工作層顯示。外部div將具有像10px高度的條帶，它被設置爲repeat-x，因此它將填充頁面的整個寬度。中心div（960）將具有不同的形狀（矩形），也是半透明的。這個想法是'body'的背景將通過所有這些展現出來。 – Dan

我更新了我的答案。 [Demo]（http://jsfiddle.net/8Bznc/4/） – bookcasey

你可以在中心div上放一個不透明的背景，這樣其他背景就不會顯示出來。

請看這裏：http://jsfiddle.net/9bnHD/

來源

2011-12-10 21:53:03 asc99c

我已經添加了一個小提琴，所以你可以看到我的意思。 – Dan

佈局問題，部分固定寬度，部分彈性

回答

相關問題