如何更改swiper的默认样式

有时候swiper插件的默认样式可能与我们需要的会有所不同，用的时候需要我们修改，那么如何修改呢？

首先要看源码：

修改一：一般我们轮播图都是水平方向让图轮播，而且图是叠在一起的，如果想让图竖着排列并且不叠在一起，该如何该呢？答案：

.swiper-slide {

      flex-direction: column!important;

    }

原因如下：

即下面这四个图，叠在一起水平轮播，我们只能看到其中一张图，但如果想改成图2，竖着，并且不折叠该怎么改？

图1 图2

平时我们做轮播可能会将图片设置成position：absolute进行叠在一起，现在想竖着排列，自然是将样式设成position：relative，但是竟然起不到效果。查看源码的css文件可以看出：swiper插件做轮播采用的是flex布局的方式，所以想竖向排列，就要将css改成flex-direction: column!important;即可竖向排列。

即想将图由横向排列变成竖向排列，就设置flex-direction: column!important;即可。

图3