爲所有瀏覽器製作圖片全寬（bg）

我正在試圖製作目前寬度爲1500px左右寬度的橫幅圖片，我已將其設置爲背景圖片，以便我可以在toptop上播放一些元素，我知道你可以製作一個圖片標籤全寬，但我不確定你是否可以對背景圖片標籤做同樣的事情！爲所有瀏覽器製作圖片全寬（bg）

這是我的代碼;

<div id="bannerbg"> 
    <div class="container"> 
      <p id="bannertxt">demo text</p> 
    </div> 
</div> 

.container{ 
    width:980px; 
    margin:0px auto; 
} 

#bannerbg{ 
    background-image:url('../images/banner.png'); 
    width:1520px; 
    height:369px; 
    background-repeat: no-repeat; 
    margin:0px auto; 
    position: absolute; 
} 

#bannertxt{ 
    background:rgba(0,0,0,0.5); 
    font-size:26px; 
    font-family: 'Roboto Condensed', sans-serif; 
    width:300px; 
    color:white; 
} 

.bannertxt{ 
    padding-top:40px; 
}

來源

2013-02-10 user2058820

http://stackoverflow.com/questions/16705367/creating-a-full-width-image/16706285#16706285請在這裏看到答案 – Joe 2013-05-23 05:36:56

嘗試使用此：

* { 
    margin:0; 
    padding:0; 
}

Here是一個工作的例子。

來源

2013-02-10 13:40:12

OO，我噱頭第二次測試我不希望它全高，所以讓我改變這個值一秒鐘，這並沒有爲我工作;/ – user2058820 2013-02-10 13:44:35

也許你正在尋找：

#bannerbg{ 
    /*Your code*/ 
    background-size:cover; 
}

來源

2013-02-10 13:45:38 Jan

多數民衆贊成全屏幕我需要一個固定的高度只是全寬:) – user2058820 2013-02-10 13:48:34

@TidalWave - 是的我也注意到:)但IE的唯一不同的解決方案是用img標籤創建另一個元素.. – Jan 2013-02-10 13:53:56

爲所有瀏覽器製作圖片全寬（bg）

回答

相關問題