Question

我已经读了这个论坛一段时间了，并决定我可以在这个论坛找到帮助，因为我找不到任何确切的答案。

我想制作一张带有大照片的着陆页，并在其上放置一张自适应图像地图。我可以制作一张地图，我可以放一张图片，但是当我想让图像保持居中时（背景位置：中心）我想让它响应时问题就开始了。如果我不使用background-position：center，那么移动设备上的图像看起来很小，而且不会像这样工作。

我知道我可以尝试在背景上放置透明图像，但我不知道如何使地图响应。

如果您可以帮助我http://www.mafia.brandscatter.com/

，这是指向我的工作网站的链接

Answer 1

这样的事情怎么样？

https://jsfiddle.net/Lj0w9dnf/1/

.background{
  background-color:red;
  width:100%;
  height:100vh;
  padding:25%;
}

.map{
  background-color:blue;
  height:100%;
  width:100%;
}


<div class="background">
  <div class="map">  
  </div>
</div>

主页响应中心的图像映射

1 个答案: