html - 删除 jquery Mobile 中的轮廓复选框

Question

我得到了这个，但我不想要黄色轮廓。我能怎么做？

我的代码：

 <div class="ui-block-a">
              <div class="ui-bar ui-bar-e" style="height:50px">
                    <input type="checkbox" name="checkbox-1" id="checkbox-1" class="custom" />
                     <label for="checkbox-1"></label>
               </div>

Answer 1

您需要分三个步骤覆盖复选框样式。

复选框本身的位置，位于可视复选框的后面。我已经div.-ui-bar在每个被覆盖的样式之前添加了，以便不具体并在其他地方保留原始样式。

演示

div.ui-bar input {
 left: 10px !important
}

标签宽度

div.ui-bar label {
 width: 27px !important
}

视觉复选框的位置

div.ui-bar .ui-checkbox .ui-btn-icon-left .ui-icon {
 left: 5px !important
}