我在客户网站上工作,遇到了一个大问题。我有一个具有 repeat-x 属性的背景图像,我需要在调整窗口大小后调整它的大小(就像响应图像的行为一样,但现在有背景)
所以代码大致是这样的:
<style>
body {padding: 0px}
#wrapper { background: url("images/barra.fw.png") repeat-x scroll 0px 115px transparent !important;}
</style>
<body>
<div id="wrapper">
<div id="pagelayout">
Lorem ipsum
</div>
</div>
要澄清的是,我想要的是垂直调整背景图像的大小以保持比例。网站是这个: http://supersorriso.pt .
PS:已经尝试过弄乱一切,无法弄清楚哪里出了问题,或者这是否可能。
最佳答案
我相信您可以在需要调整其背景大小的元素上使用 background-size
属性。
在您的媒体查询中:
#wrapper{
background-size:80px 60px;
}
您需要进行数学计算以获得正确的纵横比。
关于css - 无法在响应式布局上调整背景大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15639227/