Ionic 如何对齐卡片内的文本,卡片位于离子滑轨内

6psbrbz9  于 2022-12-16  发布在  Ionic
关注(0)|答案(1)|浏览(166)

我有一个html页面(example.page.html),在那里我使用了离子幻灯片。在每张幻灯片中,我使用选择器(app-test-1和app-test-2)导入其他页面。我在app-test-1页面中有离子卡片,我无法为它给予对齐方式,使卡片中的文本左对齐。
如果我直接运行app-test-1页面,对齐工作完美,但当我运行(它有**“app-test-1”**选择器)时,对齐不正确。

<ion-slides>
<ion-slide>
<app-test-1></app-test>
</ion-slide>
<ion-slide>
<app-test-2></app-test-1>
</ion-slide>
</ion-slides>
f1tvaqid

f1tvaqid1#

我也遇到了同样的问题。我有ion-cardion-slides和所有的对齐错位。我试图给CSS类的离子幻灯片与文本左,它的工作。我认为这是因为离子幻灯片最终将把它都放在中心。
样本代码:在HTML中;

<ion-slides>
  <ion-slide class="styless">
    <ion-card>
      <ion-card-header>
        Welcome
      </ion-card-header>
      <ion-card-content>
        HI ... Contenet goes here(without slide-1)
      </ion-card-content>     
    </ion-card>
  </ion-slide>
  <ion-slide>
    <ion-card>
      <ion-card-header>
        Welcome
      </ion-card-header>
      <ion-card-content>
        HI ... Content goes here(slide -2)
      </ion-card-content>     
    </ion-card>
  </ion-slide>

</ion-slides>```

in scss:
.styless {
text-align: left;
}

相关问题