gpt4 book ai didi

css - Symfony3 使用 Bootstrap 设置表单标签/小部件宽度

转载 作者:行者123 更新时间:2023-12-05 09:20:44 27 4
gpt4 key购买 nike

我在 Symfony3 应用程序中使用新的内置 Bootstrap 样式。

twig:
debug: "%kernel.debug%"
strict_variables: "%kernel.debug%"
form_themes:
- bootstrap_3_horizontal_layout.html.twig

我正在使用它通过它的组件(标签和小部件)呈现表单。
所有的标签都有一个宽度类 col-xs-2,宽度的小部件类是 col-xs-10。

<div class="form-group">
{{ form_label(form.name) }}
<div class="col-md-9">
{{ form_widget(form.name) }}
</div>
<div class="col-md-offset-3 col-md-9">
{{ form_errors(form.name) }}
</div>
</div>

我如何设置(全局地在所有表单上,或在 form_row 上,或在每个组件上,例如 form_label/form_widget)要使用的类。我已经尝试添加类,但这只是添加到现有类而不是替换它。

{{ form_label(form.name, 'gfdg', {'label_attr': {'class': 'col-md-3'} }) }}

它呈现 class="col-xs-2 col-md-3"

最佳答案

我知道这是一个老问题,但这可能对将来的人有所帮助。

如果您想全局设置它,只需创建一个 Twig 文件,例如form/bootstrapCols.html.twig,然后添加以下两个 block :

{% block form_label_class -%}
col-sm-2
{%- endblock form_label_class %}

{% block form_group_class -%}
col-sm-10
{%- endblock form_group_class %}

那样你将覆盖bootstrap_3_horizontal_layout.html.twig中的那些 block .将 col-sm-2col-sm-10 更改为您需要的任何内容,并使用如下所示的附加表单主题更新配置文件:

twig:
debug: "%kernel.debug%"
strict_variables: "%kernel.debug%"
form_themes: ['bootstrap_3_horizontal_layout.html.twig','form/bootstrapCols.html.twig']

如果你想改变 col- 只为一个 View ,那么只需在你的 twig View 文件中使用这个:

{% form_theme formname with ['bootstrap_3_horizontal_layout.html.twig', _self] %}

并在包含您需要的类的同一文件中添加 block form_label_classform_group_class

关于css - Symfony3 使用 Bootstrap 设置表单标签/小部件宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36503743/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com