html - 响应按钮图像

Question

这是我在这里的第一篇文章。我开始我的 css 和 html 之旅。我正在努力将两个响应图像放在一起作为按钮。我想要的是所有内容都显示在单个页面上(无需滚动)，并且无论屏幕大小如何，它总是被填充。然后在移动屏幕上使用纵向模式，它会依次显示。

这是我已经达到的程度:http://test.fulfeal.co.uk/shop-intro/

我不知道它是与图像大小有关(实际图像将是图片)还是与相应的 div 大小有关。

提前感谢您的帮助!

Answer 1

为了让图片占据整个页面的高度，首先要确保您具备以下条件:

html, body {
  height: 100%;
}

这将确保您的内容实际上可以占据页面的整个高度。然后，您的图片的高度也应该设置为 100%。

为了让图片在移动设备上显示在彼此之上，您需要使用 css 媒体查询，然后将图片设置为 display: block;宽度:100%。