离子第一张幻灯片开始之前如何添加空间

Question

我想要在离子载玻片中这样的结构

1st Image

2nd image

这意味着我想在第一个滑块之前添加一些空间，然后在我滑动时它将变为全宽。

这是我尝试过的代码

 <ion-slides slidesPerView="2.6" spaceBetween="10" (ionSlideDidChange)="slideChanged()">
                <ion-slide>
                    <div class="card">
                        <img src="assets/imgs/food1.jpg">
                    </div>
                </ion-slide>
                <ion-slide>
                    <div class="card"><img src="assets/imgs/food2.jpg"></div>
                </ion-slide>
                <ion-slide>
                    <div class="card"><img src="assets/imgs/food3.jpg"></div>
                </ion-slide>
                <ion-slide>
                    <div class="card">
                        <img src="assets/imgs/food1.jpg">
                    </div>
                </ion-slide>
</ion-slides>

我对此一无所知。任何帮助将不胜感激