如何在Materialize CSS中更改滑块的高度? [英] How to change height of slider in Materialize css?

问题描述

这是我的html代码:

Here is my html code:

<div class="slider">
  <ul class="slides">
    <li>
      <img src="img/s1.jpg">
    </li>
  </ul>
</div>

这是我的Javascript代码:

And Here is my Javascript code:

$(document).ready(function(){
    $('.slider').slider();
});

滑块可正常运行，但默认情况下高度为400像素.如何将其更改为300px?

Slider works perfectly but the height is 400px by default. How can I change it to 300px?

更改图像大小不会更改滑块的高度(高度始终为400px)

Changing image size doesn't change the height of slider (height is always 400px)

我尝试了这种方法:< div class ="slider" style ="height:300px;"> ，它也不起作用.

I tried this: <div class="slider" style="height:300px;"> , it also doesn't work.

推荐答案

在JQuery中，我们可以设置高度和其他选项(

In JQuery we can set the height and other options (https://materializecss.com/media.html) like the following:

$(document).ready(function(){

    $('.slider').slider({ 
        full_width: true,
        height : 800, // default - height : 400
        interval: 8000 // default - interval: 6000
    });

});

我们不需要为此更改图像尺寸.

We don't need to change image dimensions for that.

这篇关于如何在Materialize CSS中更改滑块的高度?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！