Ionic 4 滑块分页点与文本重叠答案

【问题标题】：Ionic 4 slider pagination dots overlap the textIonic 4 滑块分页点与文本重叠
【发布时间】：2019-06-25 05:52:26
【问题描述】：

我有 ion-slides 组件显示一些幻灯片。每张幻灯片的内容根据服务动态呈现。

通常，底部滑块点与文本重叠。有什么方法可以确保它们总是有一些差距？

 <div style="padding:15px; padding-top:30px;background-color: #232536">
  <ion-slides pager="true">
    <ion-slide *ngFor="let gal of core.gallery">
      <div>
        <img *ngIf="gal.type=='image'" src="{{gal.link}}">
        <iframe *ngIf="gal.type == 'video'" style="width: 100%" [src]="getVideoUrl(gal.link)" frameborder="0" allow="accelerometer; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
        <ion-row>
          <ion-col text-left><h2 style="color:white" >My Title</h2>
          </ion-col>
        </ion-row>
        <ion-row>
          <ion-col style="color:#A2A0B2" text-left>{{gal.desc}}</ion-col>
        </ion-row>
      </div>
    </ion-slide>
  </ion-slides>

【问题讨论】：

对这个有什么建议吗？

标签： ionic-framework ionic4 ion-slides

【解决方案1】：

在幻灯片内容的末尾添加一个
标签并从底部定位点，在 global.css 文件中添加以下 CSS

.swiper-pagination {
    bottom: 3px !important;    
}

【讨论】：