如何在离子框架中与复选框一起使用时从离子标签中删除空格

Question

我想使用复选框，但离子标签内有空格。我无法删除离子标签中的空间。我想水平居中显示复选框。我的代码如下，有人可以帮我解决这个问题吗？

    <ion-item text-center no-lines>
        <ion-label color="secondary">
            keep me signed in
        </ion-label>
        <ion-checkbox item-right [(ngModel)]="Remember"></ion-checkbox>
    </ion-item>

Answer 1

我的解决方案并不花哨，但有效。

在您相应的*.scss

ion-item{
    .input-wrapper{
        flex:none;
        margin-left: auto;
    }
    ion-checkbox.checkbox{
        margin-right: auto !important;
    }
}

Answer 2

早上好希望这朵云可以帮助你

ion-item.item-input {
    padding-left: 0;
}

Answer 3

Ionic 6 及更高版本（包括 Ionic V8）需要使用 CSS ::part 伪元素来设置 Ionic 组件内部元素的样式。 要在 Ionic V8 中设置离子复选框标签的样式，请使用以下 CSS：

ion-checkbox::part(label) {
    margin-inline-start: 0.5rem;
}

这将为 ion-checkbox 元素内的标签开头添加 0.5rem 的边距。