我怎麼能在中心離子2應用

Question

你好，我有一個離子2應用程序的某些頁面，即有一個內部的..這樣

<ion-content padding> 
    <p>Some text here....</p> 
    <p>Some other text here...</p> 
    <ion-img width="180" height="180" src="assets/images/goal.jpg"></ion-img> 
    <p>bottom text here...</p> 
</ion-content> 

我需要看圖像水平居中的圖像..我已經測試了一些CSS，但沒有運氣。我該如何實現這一目標？

Answer 1

您可以使用離子CSS utilities通過將屬性text-center應用於要橫向居中的元素的父元素來對齊居中。

下面是一個例子：

<ion-content text-center> 
    <img src="assets/imgs/logo.png" width="128" /> 
</ion-content> 

在你的情況我想包的<img>在<div>，使其隻影響圖像，而不是<p>元素。

像這樣：

<ion-content padding> 
    <p>Some text here....</p> 
    <p>Some other text here...</p> 
    <div text-center> 
    <ion-img width="180" height="180" src="assets/images/goal.jpg"></ion-img> 
    </div> 
    <p>bottom text here...</p> 
</ion-content>