如何修改Django Crispy Forms密码重置表单的帮助文本颜色？

我在Django中使用Crispy Forms搭建了一个密码重置表单，已将背景色改为黑色、文本色改为白色，但帮助文本仍为黑色，如图所示：

我尝试通过CSS设置白色，甚至用JavaScript的setProperty()方法指定颜色，但帮助文本依然是黑色。

我的模板代码如下：

{% extends "base.html" %}
{% load static %}
{% load crispy_forms_tags %}

{% block title %}Password change{% endblock %}

{% block styling %}
    <link rel="stylesheet" href="{% static "styly_main.css" %}">
    <style>
        body {
            background-color: #192444;
        }
        .c2 {
            max-width: 280px;
            background-color: black;
            color: white !important;
            border: black solid 1px;
            border-radius: 6px;
            padding: 1rem;
            padding-bottom: 1.25rem;
            margin: 1rem;
            text-align: center;
            margin-left: auto;
            margin-right: auto;
        }
        .container {
            max-width: 350px;
            min-width: 340px;
        }
    </style>
{% endblock%}

{% block content %}
    <div class="container-fluid overflow-hidden">
        
        {% include "includes/header_main.html" %}

        <div class="container c1">

            <div class="row gx-1">
                <div id="id1" class="col text-center pb-2 pt-3">
                    <H3>Password change</h3>
                    
                    <form method="post">
                        {% csrf_token %}
                        <div class="c2">
                            {{ form|crispy }}
                        </div>
                        <p>
                            <button type="submit" class="btn btn-dark"><i class="fa-solid fa-floppy-disk"></i>  Submit</button>
                        </p>
                    </form>
                    
                    <p>
                        <a href="{% url 'index' %}" class="a2">Back to Home.</a>
                    </p>
                </div>
            </div>

        </div>

        {% include "includes/footer.html" %}

    </div>

{% endblock  %}

{% block script %}

<script>

const id1Elm = document.getElementById("id1");
id1Elm.style.setProperty('color', 'white', 'important');


</script>

{% endblock script %}

请问有什么方法可以修改帮助文本的颜色？

Crispy Forms会给表单帮助文本自动生成特定CSS类，针对这些类设置样式即可解决问题，以下是几种可行方法：

• 方法1：精准定位目标元素
  在你的<style>块中添加以下CSS规则，通过父容器.c2锁定帮助文本，确保样式优先级足够：

.c2 .form-text.text-muted {
    color: white !important;
}

Crispy Forms默认会把帮助文本放在带有form-text text-muted类的元素里，这条规则可以直接覆盖默认的深色文本。

• 方法2：全局适配深色主题
  如果需要所有页面的表单帮助文本都适配深色背景，可在全局CSS文件（如styly_main.css）中添加：

.form-text.text-muted {
    color: #ffffff !important;
}

• 方法3：自定义Crispy模板（进阶）
  若不想使用!important提升优先级，可自定义Crispy的表单模板：

1. 在项目中创建templates/crispy_forms/目录
2. 复制Crispy Forms原模板（如field.html）到该目录
3. 修改模板中帮助文本的代码段，添加自定义类或直接设置style="color:white;"

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