我在页面上放了一些文字和一个按钮.我当前正在使用我所知道的传统css方法来集中它.这是以IONIC 2为中心的正确方法吗？
<ion-content padding class="login-signup">
<ion-card>
<div class="or-label">
SOME-TEXT
</div>
<div class="signup-button">
<button outline>Signup</button>
</div>
</ion-content>
//对应的css
.or-label {
width: 20%;
font-size: 16px;
margin: 0 auto;
margin-top: 2em;
margin-bottom: 2em;
height: 50px;
text-align: center;
color: red;
}
.signup-button {
text-align:center;
}
解决方法
更新
就像@ AndrewGraham-Yooll在他的回答中提到的那样,fab-center属性在几个版本之前被移除了,所以现在唯一的方法就是使用带有文本中心的容器utility attribute
<ion-content padding class="login-signup">
<ion-card text-center>
<div class="or-label">
SOME-TEXT
</div>
<button outline>Signup</button>
</ion-card>
</ion-content>
您可以通过添加Ionic2属性fab-center来使按钮居中,如下所示：
< button fab-center outline>注册< / button>
您可以在Ionic2 docs中找到有关Ionic2属性的更多信息.
关于另一个div,因为它不是一个离子组件(如按钮或标签),你应该使用一些像你正在做的传统css规则或使用像文本中心这样的Utility attribute.
