Bxslider设置高度

Question

所以我刚开始使用bxslider.

但是我在设置滑块大小时遇到​​了问题.当然它需要最大元素的高度(我认为).如何将其设置为固定高度,比如200px？

Answer 1

您可以添加以下css.

.bx-wrapper, .bx-viewport {
    height: 200px !important; //provide height of slider
}

看看这个小提琴.. bxslider

Answer 2

为什么不设计元素的样式？如果为包装器设置固定高度,可能会遇到溢出和定位问题.

如果您使用的是列表:

.bx-wrapper ul li { height: 200px; }

Answer 3

您需要设置所有涉及图像高度的3个元素,这些元素是主容器,内部容器和图像本身......

像这样:

.bx-wrapper, .bx-viewport, .bx-wrapper img {height: 500px !important;}

• 我应该注意:
  bxSlider使用100%的宽度来保持内容的响应,因此你可能会通过强制高度来获得扭曲的图像,这就是为什么你需要将预先调整大小的图像提供给滑块(只是为了修复高度问题.. )

• 解决方案:
  在移动设备上查看时使用媒体查询设置不同的高度(仅建议)

祝你好运......