css - 横向模式下智能手机和平板电脑的响应图像

Question

我有一个非常简单的图片库网站。每个页面仅包含一个图像 (600 x 400) 或一个图像 slider 。我的网站在横向模式下的智能手机/平板电脑甚至笔记本电脑上的外观有问题。因为图像/ slider 的底部将被切掉。所以你需要向下滚动才能看到整个图像。在我的台式机或小型设备上的纵向模式下，它看起来不错。我希望图像/ slider 在这些屏幕上以较小的尺寸显示，因此您无需向下滚动即可查看整个图像。有人可以帮我弄这个吗？我在 wordpress 中用一个二十六岁的 child 主题构建了这个。

谢谢，朦胧

Answer 1

我推荐使用 Slick carousel。这是一个简单的 slider 启动器，将为您节省大量时间和调整:http://kenwheeler.github.io/slick/

对于单个图像，使用以下 css 属性:

max-width: 100%;
height: auto;