我需要在图像顶部和底部留出空间,这样它就会居中,而 ion-col 会向下。
<ion-content [fullscreen]="true" class="bg-class" text-center>
<ion-img src="assets/icon/moon_logo.png" style="width:80%; margin: auto;">
</ion-img>
<ion-col>
<div style=" margin: auto; padding-bottom: 15px;">
<ion-button expand="block" style="--background:white; color: #1B0B50;">Login</ion-button>
</div>
<div style="margin: auto;">
<ion-button expand="block">Get Started</ion-button>
</div>
<ion-row style="justify-content: center;">
<p style="color: #576898; font-size: 12px;">Privacy Policy</p>
<p style="color: #576898; font-size: 12px; padding-left: 20px;">Terms Of Use</p>
</ion-row>
</ion-col>
</ion-content>
预期显示结果
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
首先,在 ion-row 中使用 ion-col ,在 ion-grid 中使用 ion-row ,否则你会看到意想不到的结果。现在有很多解决方案,一种是使用flex和flex-grow: