Twitter bootstrap 3 更改Symfony表单的复选框设计（引导3）

目前我使用Symfony 3.0和默认的Bootstrap 3表单模板。

bootstrap\u 3\u layout.html.twig

我希望扩展表单模板，使所有复选框如下所示：

<div class="md-checkbox-list">
    <div class="md-checkbox">
        <input type="checkbox" id="checkbox1" class="md-check">
        <label for="checkbox1">
            <span></span>
            <span class="check"></span>
            <span class="box"></span> Option 1 </label>
    </div>
    <div class="md-checkbox">
        <input type="checkbox" id="checkbox2" class="md-check" checked>
        <label for="checkbox2">
            <span></span>
            <span class="check"></span>
            <span class="box"></span> Option 2 </label>
    </div>
    <div class="md-checkbox">
        <input type="checkbox" id="checkbox3" class="md-check">
        <label for="checkbox3">
            <span></span>
            <span class="check"></span>
            <span class="box"></span> Option 3 </label>
    </div>
    <div class="md-checkbox">
        <input type="checkbox" id="checkbox4" disabled class="md-check">
        <label for="checkbox4">
            <span></span>
            <span class="check"></span>
            <span class="box"></span> Disabled </label>
    </div>
</div>

选择1
选择2
选择3
残废

我怎么能这样做？我尝试了很多方法，但都没有成功。Symfony表单模板非常复杂。更改一些输入或其他简单的事情都可以正常工作，但复选框并不容易

---

我希望有人能帮助我，因为我有很多这样的设计，我不知道如何修改复选框样式使其看起来像这样。

你应该使用FormType来定义你的表单

$builder->add('cb1',  CheckboxType::class)->add('cb2',  CheckboxType::class);

然后在你的小树枝上

{{ form_start(form, { 'attr': { 'class': 'form-horizontal form-bordered'} }) }}
    <div class="form-group">
        {{ form_label(form.cb1, 'cb1 label', { 'attr': {'class': 'control-label'} }) }}
        {{ form_widget(form.cb1, { 'attr': {'class': 'form-control custom-cb-class'} }) }}
    </div>
{{ form_rest(form) }}
{{ form_end(form) }}

{{form_start（form，{'attr'：{'class'：'form horizontal form bordered'}}}}
{{form_label（form.cb1，'cb1 label'，{'attr'：{'class'：'control label'}}}}}
{{form_小部件（form.cb1，{'attr'：{'class'：'form control custom cb class'}}}}}}
{{form_rest（form）}
{{form_end（form）}}

复选框由呈现。您需要使用自己的布局覆盖此块

当您处理复选框列表时，您还必须自定义。在这里您需要小心，因为选项中使用的类型取决于是否可能有多个选项（radio vs.checkbox）