Wordpress - 全屏缩放

Question

我正在为我建立一个网站。我安装了 MetaSlider 插件。我希望摄影在整个屏幕上缩放（无需滚动屏幕）。理想情况下，“第一个屏幕”也应该显示菜单栏（底部）。如何做到这一点？

<?php 
    echo do_shortcode("[metaslider id=62 percentwidth=100]"); 
?>

Answer 1

为您的菜单设置 50 像素的高度（或任何您喜欢的高度），然后将此高度添加到您的滑块图像中：

.sticky_header {height: 50px}

.metaslider .slides img {
  height: calc(100vh - 50px); /* The height of the viewport - the height of your menu */
}

理想情况下，您应该在滑块中添加图像：object-fit: cover;，这样就不会扭曲图像。

.metaslider .slides img {
   height: calc(100vh - 50px); 
   object-fit: cover;
}