Css 离子输入2中的文本对齐

我在爱奥尼亚有这个html

<ion-label color="primary" stacked>Email</ion-label>
<ion-input type="email" placeholder="Email Input"></ion-input>

电子邮件

---

如何使文本输入对齐右侧的文本

在每个

离子输入

内部有一个

输入

，此输入就是您需要的样式，只需执行以下操作：

ion-input {
  input {
    text-align: right;
    /* IF YOU ALSO WANT TO PUSH PLACHEHOLDER TO THE RIGHT USE THE FOLLOWING, IF NOT JUST DELETE THE ::-webkit-input-placeholder*/
    ::-webkit-input-placeholder {
      text-align: right;
    }
  }
}

希望这能有所帮助。

爱奥尼亚3:

<ion-input text-center></ion-input>

Rem[！[在此输入图像描述][1][1]余烬密码
登录

现在看起来真的很容易。要右对齐，

text right

也可以。令人惊讶的是，这没有被记录在案。

<div class="topPedding">
    <ion-item>
      <ion-input type="text" placeholder="Username" text-center></ion-input>
    </ion-item>
    <ion-item>
      <ion-input type="password" placeholder="Password" text-center></ion-input>
    </ion-item>
    <ion-item class="border-none" lines="none">
      <ion-toggle color="primary"></ion-toggle>
      <ion-label>Rem[![enter image description here][1]][1]ember Password</ion-label>
    </ion-item>
    <ion-button color="light" expand="block">Sign In</ion-button>
  </div>