0

似乎没有什么对我有用。但我想做的是使标题图像适合我想要的大小，即容器。继承人的实际页面链接：this。这里是 jsFiddle：http: //jsfiddle.net/Zorabelle/f7DRh/。

我认为这是我必须解决的问题，但我只是不知道。

/*HEADER IMAGE DETAILS - HEADER MUST BE 921PX WIDE*/
.header {
        background-image: url(http://media.tumblr.com/aceb30d864925524ee215c0d6f88e1bc/tumblr_inline_mu0br62w4R1s7znag.gif);
        background-repeat:no-repeat;
        height:200px; /*CHANGE TO THE HEIGHT OF YOUR BANNER*/
        }

我希望“定义术语”标题填满整个空间。帮助？

4

2 回答 2

3

这是一个有效的 JSFiddle 示例：http: //jsfiddle.net/f7DRh/2/

您可以通过指定将图像大小设置为容器：

background-size:100% 100%;

这样，它将始终保持在容器的宽度和高度内。

参考： http ://www.w3schools.com/cssref/css3_pr_background-size.asp

于 2013-10-01T22:50:00.783 回答
0

你也可以使用传统的替换你的 div

<div class="container">
    <div class="header">
</div>

变成

<div class="upcon">
    <img src="http://yourimage.com" style="width:100%" />
</div>

顺便说一句，如果用户的分辨率小于您要求的分辨率（1050px），浏览器会尝试使用此方法正确呈现图像。它不会裁剪它。

于 2013-10-01T22:57:35.257 回答