使用小部件更改 Django 表单中标签的 CSS

Question

我正在尝试将 CSS 样式应用于 Django（版本 3.1.3）中的管理员登录表单。我可以通过 forms.TextInput(attrs={'class':'textinputclass'}) 方法使用小部件轻松自定义输入，但是似乎无法将 CSS class 添加到标签？我可以将标签设置为“false”，这样它根本就不会显示，但理想情况下我希望能够将 CSS class 关联到它。

我下面的代码显示了用于用户名和密码文本输入的小部件。如何为标签做类似的事情？

class MyAuthForm(AuthenticationForm):
    class Meta:
        model = Lesson
        fields = ['username', 'password']

    def __init__(self, *args, **kwargs):
        super(MyAuthForm, self).__init__(*args, **kwargs)
        self.fields['username'].widget = forms.TextInput(attrs={'class': 'input', 'placeholder': 'Username'})
        self.fields['username'].label = False
        self.fields['password'].widget = forms.PasswordInput(attrs={'class': 'input', 'placeholder': 'Password'})
        self.fields['password'].label = False

Answer 1

如果您不介意单独渲染标签，这很容易做到。我自己还没有找到更简单的方法。

在模板中：

{% for field in form %}
        <label class="label-class">{{ field.label }}</label>
        {{ field }}
    {% endfor %}

模板中字段的 label 将默认呈现字段的 name。如果你想设置一个特定的标签，你必须将它传递到字段而不是小部件：

username = forms.CharField(max_length=254, label='Username', widget=forms.TextInput(
        attrs={
        'class': 'input',
        'placeholder': 'username',
        }
    ))

进一步阅读：How to set css class of a label in a django form declaration?

使用小部件更改 Django 表单中标签的 CSS

using widgets to change the CSS of label in Django forms

css

django

django-forms

django-widget