0

定位全宽标题。我希望它出现这样的东西。http://meem.co.vu/

分区:

<div id="shell"> 

<div class="img"><img src="http://static.tumblr.com/ydsgqx5/f28mqvumo/waterfall-nature-wallpaper.png" width="448" height="336" alt="" /></div> 
<div id="msg"></div> 

</div> 

CSS:

#shell { margin:0; 
padding:30px; 
width:600px; 
height:400px; 
background:#eee; }
div.img { width:360px; 
height:280px; 
overflow:hidden; 
margin:auto; 
}
#banner {
width: 960px;
height: 400px;
margin: 0 auto 30px;
overflow:hidden;
float: left;
}
#banner img {
left: 0;
top: 0;
position:absolute;
}

其他链接:http: //jsfiddle.net/BeCF9/55/

我似乎无法让图像在屏幕上占据整个页面。

我怎样才能做到这一点?

谢谢你。

4

2 回答 2

0

检查 JSfiddle

http://jsfiddle.net/BeCF9/58/

#shell { margin:0; background:#eee; }
div.img { width:100%; overflow:hidden; margin:auto; border:1px solid #333; }

检查将 div.img 设置为 100% 的屏幕截图,还将 img 宽度覆盖为 100%。

希望下面的截图看起来像你想要的 在此处输入图像描述

于 2013-08-02T03:44:25.450 回答
0

我是meem.co.vu 的所有者!

首先,我很高兴你欣赏我的标题设计。由于我不再使用您所引用的特定站点布局,因此人们可能无法理解您要询问的内容。

为了让我的标题在屏幕上显示为全尺寸,我所做的是width: 100%;在 CSS 中。为了让背景也保持完整大小,我添加background-size: cover;了 CSS。我希望这有帮助。:)

于 2013-08-21T01:46:16.583 回答