Html MaterializeCS中的从右到左复选框，而不是从左到右

我正在使用MaterializeCSS框架，我想在表单中使用一个复选框。默认情况下，复选框位于标签的左侧（默认情况下从左到右），但我希望将复选框的位置更改为标签文本之前

<p>
    <input type="checkbox" id="rememberme" class="" />
    <label class="right-align"  for="rememberme">Remember me</label>
</p>

记得我吗

---

有可能吗？

当复选框未选中时

[type="checkbox"]+label:before,
[type="checkbox"]:not(.filled-in)+label:after
{
left:175px;
}

当checkbx被选中时

[type="checkbox"]:checked+label:before
{
left:175px;
}

---

级联属性有帮助。

我找到了更好的解决方案

[type=“checkbox”]+标签：：之前，[type=“checkbox”]：未（.filled in）+标签：：之后{
右：0；
}
[type=“checkbox”]+标签{
右边填充：26px；
}
[type=“checkbox”]：选中+标签：：之前{
右：8px；
左：0；
}
.填写[type=“checkbox”]：选中+标签：：之前{
右：9px；
左：未设置；
}
.填写[type=“checkbox”]：选中+标签：：之后{
}
.填写[type=“checkbox”]+标签：：之前，.填写[type=“checkbox”]+标签：：之后{
右：-1px；
}
.填写[type=“checkbox”]：未（：选中）+标签：：之前{
右：10px；
}
[type=“radio”]：未（：选中）+标签{
右边填充：26px；
}
[type=“radio”]：选中+标签{
右边填充：26px；
}
[type=“radio”]+标签：：之前，[type=“radio”]+标签：：之后{
右：0；左：未设置；
}
label:：before，[type=“radio”]+label:：after{
右：0；左：未设置；
}

这可能也会奏效：（正确的答案对我来说不太合适），确实如此

    [type="checkbox"]+label {
        padding-left: 0;
        padding-right: 35px;
    }
    [type="checkbox"].filled-in:not(:checked)+label:after {
        right: 0;
    }
    [type="checkbox"].filled-in:checked+label:after {
        right: 0;
    }
    [type="checkbox"].filled-in:checked+label:before {
        right: 10px;
    }
    [type="checkbox"].filled-in+label::before,
    [type="checkbox"].filled-in+label::after {
        right: 10px;
    }
    [type="checkbox"].filled-in:not(:checked)+label::before {
        right: 10px;
    }

---

经过一些测试，这对我来说是有效的：

我把复选框放在右边，把标签垫在右边，直到我感觉它在正确的位置

在css文件中：

body{ direction: rtl }

/*  align the checkbox to the right    */
[type="checkbox"]+label:before, [type="checkbox"]+label:after{        
  right: 0px !important;
}

/*  align the v in the center of the checkbox    */
[type="checkbox"].filled-in:checked+label:before{
  right: 11px !important;
}

/*  align the label left to the checkbox   */
[type="checkbox"]+label{
  padding-right: 27px !important;
}

正文{
方向：rtl；
}
/*复选框R2L*/
[type=“checkbox”]+span:not（.lever）{
右边填充：27px；
}
[type=“checkbox”]。填写：不（：选中）+span:not（.lever）：在，
[type=“checkbox”]。填写：选中+span:not（.lever）：之前{
右：10px；
}
[type=“checkbox”]。填写：不（：选中）+span:not（.lever）：之后，
[type=“checkbox”]。填写：选中+span:not（.lever）：之后{
右：0；
}

أرسل لي إيميل عند إضافة إجابة

欢迎使用堆栈溢出！请不要只回答源代码。试着提供一个关于你的解决方案如何工作的很好的描述。请参阅：。谢谢