Question

所以我尝试用100vh设置封面图像 - 但我有非常具体的情况。

在我的形象上，我有大盘子和平板电脑，＃34;躺下＆＃34;在这个盘子里。

我的目标是使这个图像100vh标题，但有一个问题 - 当我尝试在我的大显示器上测试它看起来没问题，但在高度较小的显示器上它看起来很糟糕 - 我需要这个平板电脑在所有桌面设备中100％可见。

检查我的小提琴＆＃34;整页＆＃34;选择看看我的情况。

我也尝试不使用平板电脑制作此图片封面，然后尝试使用平板电脑和position:absolute放置另一张图片，但我的第二张图片并不总是在相同的位置到此脚板

是否有可能实现我的愿望？

＆＃13;

.cover {
  position: relative;
  height: calc(100vh - 80px);
  background-size: cover;
  background-position: bottom;
  background-repeat: no-repeat;
  background-image: url(https://s4.postimg.org/uwxudv17x/cover.png);
}

＆＃13;

<body>
  <div class="cover">
  </div>
</body>

＆＃13;

Answer 1

所有桌面设备的快速解决方法是设置

background-position: bottom right;

在100vh的背景盖子图象 - 屏幕区别

1 个答案: