CSS背景

我正在學習CSS，我正在網站上使用它來控制網站的佈局。CSS背景

我有一個容器，其中5個，所有在彼此的頂部，我有一個頁面的背景，但我也想爲其中一個容器使用背景。所以我用'background-image:url("");'標籤來使用背景，我也使用了附件，重複一遍。我是這個形象的問題是沒有將自己設置到容器，它推動了我在CSS代碼中設置的尺寸，這些尺寸是height:312px;和width: 1000px;

這裏是CSS

html, body 
{ 
margin-top: 25px; 
padding: 0; 
background-image:url("../../images/background.png"); 
background-repeat: none; 
background-attachment: fixed; 
} 

.hidden 
{ 
display: none; 
} 

#page-container 
{ 
width: 1000px; 
margin: auto; 
background: transparent; 
} 

#header 
{ 
height: 130px; 
} 

#content-top 
{ 
background: #D9D9D9; 
background-image:url("../images/pic.png"); 
background-repeat: no-repeat; 
background-attachment: fixed; 
background-position:right top; 
height: 312px; 
width: 1000px; 
}

下面是HTML：

<div id="page-container"> 

    <div id="header"> 
     <div id="flashContent"> 

     </div> 
    </div> 

    <div id="content-top"><!--<img src="images/pic.png">--></div> 

    <div id="portfolio-container"> 

     <div id="portfolio1"><p>1</p></div> 

     <div id="portfolio2">2</div> 

     <div id="portfolio3">3</div> 

     <div id="portfolio1"><p>4/p></div> 

     <div id="portfolio2">5</div> 

     <div id="portfolio3">5</div> 

    </div> 

    <div id="main-content"> 
     main-content 
    </div> 

    <div id="footer">Footer</div> 

</div>

我沒有粘貼所有的CSS的，但需要它的讓我知道。

它就好像背景填充的空間比指定的空間大得多。

來源

2011-11-21 ragebunny

背景圖像的尺寸是多少？ – martincarlin87

他們是312 949我希望它坐在容器的右側。 – ragebunny

上次我需要做這樣的事情，我做了以下內容：

#background{position:absolute; top:0; left:0; width:100%; max-width:1024; max-height:768; height:auto; z-index:-1; }

然後我的網頁上我包括如下：

<img id="background" src="whatever.jpg" alt="" title="" />

就是這樣。這實際上工作得非常好，背景圖像神奇地調整自己的大小，直到其中一個尺寸（寬度或高度）達到指定的最大值。它不需要CSS3支持。試試看看。

顯然調整定位的東西，如果你不想它填滿屏幕（我做過）。

來源

2011-11-21 10:48:29

您必須設置background-size至100％

它只能在瀏覽器支持CSS3

來源

2011-11-21 10:42:53

這已經解決了這個問題，但有一種創造了新的。現在圖像被拉伸以適應容器的寬度，我希望它坐在容器的右側...如果我在這個容器的側面製作一個更小的盒子，並將其設置爲100％，應該工作，我會也能夠圍繞它獲得一個不錯的寄宿生。這是解決問題的好方法嗎？ – ragebunny

你也可以在裏面放置一個標籤，並把它和重疊的元素設置爲'position：absolute;' –

嘗試浮動：留在#contentTop

希望幫助！

在CSS中你也有後臺尺寸：包含/覆蓋

來源

2011-11-21 10:48:21

回答

相關問題