通過css居中背景顏色

我在背景中有一個居中圖像，但是我需要我的主背景色來像圖像一樣伸展並保持在中心位置。通過css居中背景顏色

這裏是身體背景的CSS

body{padding:0; margin:0; background:url(/b.jpg) center 10px no-repeat;}

下面是主要背景

.main{background:#4e4645;}

我用盡背景，地位和利潤百分比，沒有運氣的CSS。

來源

2013-02-13 Jeft Lebowski

顯示你的HTML也請。 – 2013-02-13 17:09:29

@BillyMoat它的只是簡單 ...

...

– 2013-02-13 17:11:56

正如@傑克艾倫的要求，你能告訴我們一張圖片，看看它現在看起來如何，你希望它看起來如何？ – 2013-02-13 17:34:46

您可以使用margin: 0 auto將您的.main div居中放在正文中。然後，您只需將.main的寬度設置爲等於身體背景圖像的寬度即可。

.main { 
    margin: 0 auto; 
    width: 300px; 
    background: #4e4645; 
}

請參閱DEMO。

來源

2013-02-13 17:33:44 zakangelle

是的。謝謝你 – 2013-02-13 17:45:05

@JeftLebowski只是說如果你想要一個流暢的答案，背景擴大以適應不斷變化的圖像大小，請看下面。 – InsomniaBass 2013-02-14 08:59:18

這是你想要實現的嗎？

http://jsfiddle.net/aX24s/1/

在我使用兩個背景顏色的例子，明顯替代的圖像。我已經把50％的不透明度在內div來表明他們的規模都完全匹配（一個塊是鮮綠色的，一塊是紅色的，所以顏色混合）。

你有兩個背景相同的大小和完全重疊。

HTML：

<body> 
    <div class="outer_div"> 
     <div class="inner_div"> 
     </div> 
    </div> 
</body>

CSS：

.outer_div { 
    width:50px; 
    margin:0 auto; 
    height:50px; 
    background-color:#dd0000; 
} 

.inner_div { 
    background:#00dd00; 
    width:100%; 
    opacity:0.5; 
    height:100%; 
}

來源

2013-02-13 17:37:29 InsomniaBass

通過css居中背景顏色

回答

相關問題