为所有浏览器制作图片全宽（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）

回答

相关问题