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属性。

请记住，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%;

调整图像大小，固定位置

1 个答案: