如何修改django-bootstrap4渲染的Django表单label字体大小

方法1：在模板调用bootstrap_field时指定label类（灵活控制单个字段） #

django-bootstrap4的bootstrap_field标签支持label_class参数，你可以给label自定义类后配置样式：

1. 模板中修改字段调用代码：

{% bootstrap_field event_form.title layout='horizontal' size='small' label_class="custom-form-label" %}
{% bootstrap_field event_form.description layout='horizontal' size='small' label_class="custom-form-label" %}
{% bootstrap_field event_form.event_type layout='horizontal' size='small' label_class="custom-form-label" %}

2. 在页面css中添加对应样式：

.custom-form-label {
    font-size: 13px !important;
}

如果需要同时修改字段样式，保留你原来在forms.py中给widget加的style属性即可。

方法2：全局控制当前表单所有label样式（无需逐个修改字段） #

你可以给包裹表单的<form>标签添加自定义类，通过后代选择器统一修改所有label样式：

1. 给表单加自定义类：

<form class="event-form-container" method="post">
    <!-- 表单内容 -->
</form>

2. 添加css样式：

/* 选中水平布局下的默认label类 */
.event-form-container .col-form-label {
    font-size: 13px;
}
/* 同时修改字段样式的话补充 */
.event-form-container .form-control {
    font-size: 13px;
}

这个方法不需要修改单个字段的渲染代码，适合批量修改表单内所有标签、字段的样式。

方法3：在Form类中直接配置label属性（无需修改模板、css） #

Django 1.9及以上版本支持直接给字段配置label_attrs属性，你可以在表单的初始化方法中统一给所有label添加行内样式：
修改forms.py中的EventForm类：

class EventForm(ModelForm):
    def __init__(self, *args, **kwargs):
        super(EventForm, self).__init__(*args, **kwargs)
        # 统一给所有字段的label添加样式
        for field in self.fields.values():
            field.label_attrs = {"style": "font-size: 13px;"}

    class Meta:
        model = Event
        widgets = {
            'event_type': forms.Select(
                attrs={
                    'size': '4',
                    'style': 'font-size:13px;'
                }
            ),
        }
        labels = {
            'equipments': 'Equipment', 'event_type': 'Type',
        }
        fields = '__all__'

这种方式不需要修改前端模板代码，直接在后端完成所有样式配置，同时保留了你原来对表单字段的样式设置，即可实现label和字段字体都是13px的效果。

内容的提问来源于stack exchange，提问作者Cheknov