ionic 4：将内容推向 ion-content 的底部

Question

我有我的代码

<ion-header>
  <ion-toolbar>
    <ion-title><ion-row><ion-col text-center>MY APP</ion-col></ion-row></ion-title>
  </ion-toolbar>
</ion-header>

<ion-content fullscreen>
<div style="padding-top:300px;padding-left:20px">
      <ion-slides pager="false" [options]="slideOpts">
          <ion-slide>
              <ion-card>
                  <ion-card-header style="color:white">TRENDING</ion-card-header>
                  <ion-card-content>

                  </ion-card-content>
                </ion-card>
          </ion-slide>
          <ion-slide>
              <ion-card style="background-color:darkslateblue;opacity: 0.9;min-width:200px;height:200px">
                  <ion-card-header style="color:white">Events</ion-card-header>
                  <ion-card-content>

                  </ion-card-content>
                </ion-card>
          </ion-slide>
        </ion-slides>

  </div>
</ion-content>

如果你看到 div 里面的 ion-content 有一个 padding-top 300px。但这并不是让我的离子载玻片始终到达底部的正确方法。我该如何实现？

Answer 1

要更改任何 Dom 的位置，有多种方法，我将写出其中两种方法：

1- 通过使用 flex。 (https://css-tricks.com/snippets/css/a-guide-to-flexbox/)

2- 通过使用position 并将bottom 设置为0； (https://www.w3schools.com/css/css_positioning.asp)

ionic 4：将内容推向 ion-content 的底部

ionic 4: pushing contents towards the bottom of ion-content

ionic-framework

ionic4