调整图像大小，固定位置

Question

我想保留这些横幅位置不变。并使它们可以调整大小。因为在较小的显示器上，横幅随时随地都可以使用。而且他们总是比背景更大。如果你调整浏览器的大小，你可以看到我想说的。

http://mecanik.net/theback/5/index_1.html

.tab1{background-image:url(../images/tab1.PNG); width:302px; 
height:201px; background-repeat:no-repeat; display:block; 
position:absolute; top:18%; left:5%;} 

Answer 1

因为他们的父母DIV的背景，它已经重新调整，可以设置图像尺寸，以它的一个百分比。百分比高度和宽度是它们的父容器，所以像％15这样的东西应该这样做。由于您将它们显示为其容器的背景，因此您需要使用css background-size属性。

请记住，背景大小只适用于除IE 8及更早版本IE之外的所有内容。

将.tab1的背景设置为images/tab1.PNG。删除html img标签，然后尝试将下面的代码添加到css中的.tab1。你必须稍微使用一些百分比，但它应该开始使事情成比例。

background: url(../images/tab1.png); background-size: 100% auto; height:20%; width:30%;