我想在左边和右边有两个离子标签,并在两者之间切换。
以下是html:
<ion-row>
<ion-col>
<ion-list>
<ion-item>
<ion-label>Income</ion-label>
<ion-toggle name="isIncome" [(ngModel)]="isIncome"></ion-toggle>
<ion-label >Outcome</ion-label>
</ion-item>
</ion-list>
</ion-col>
</ion-row>
我试着放一些定制的样式(浮点,位置.)离子标签的元素,但它不起作用。有办法做到这一点吗?它不需要是离子标签,也许我应该使用其他容器?
谢谢。
发布于 2017-07-12 21:27:20
看起来离子项目将寻找离子标签,并将两个标签包装在一个div中。我们可以这样破解它,并覆盖页边距0:
html
<ion-item>
<ion-label>
<ion-label float-left>Income</ion-label>
<ion-label float-right>Outcome</ion-label>
<ion-toggle name="isIncome" [(ngModel)]="isIncome" class="ion-toggle-class"></ion-toggle>
</ion-label>
</ion-item>
css
.ion-toggle-class {
margin: auto !important;
}
它在移动上看起来不错,但是如果你想让这两个标签保持更接近网络上的切换键,你可能想要使用离子行,就像RezaRahmati的答案一样。
发布于 2017-07-12 12:44:29
尝尝这个
<ion-item>
<ion-row>
<ion-col text-left>
<ion-label>Income</ion-label>
</ion-col>
<ion-col text-center>
<ion-toggle name="isIncome" [(ngModel)]="isIncome"></ion-toggle>
</ion-col>
<ion-col text-right>
<ion-label >Outcome</ion-label>
</ion-col>
</ion-row>
</ion-item>
https://stackoverflow.com/questions/45066725
复制相似问题