Как изменить цвет текста стандартной формы UserCreationForm в Django?

Я работаю над простым сайтом, используя django и bootstrap. Я использовал класс UserCreationForm, чтобы сделать стандартную страницу регистрации. Но я хотел бы сделать текст немного темнее, чтобы он был более разборчивым и хорошо контрастировал с фоновым изображением и маской. Какое решение будет лучшим?

enter image description here

Модуль просмотра

def register(request):
    #if the request method is a  'get'
    #Yes initial data
    if request.method != 'POST':
        form = UserCreationForm()
    #no initial data
    #f the request method is a 'post'
    else:
        form = UserCreationForm(data=request.POST)
        if form.is_valid():
            new_user=form.save()
            authenticated_user = authenticate(username=new_user.username,
                                          password=request.POST['password1'])
            login(request, aunthenticated_user)
            return HttpResponseRedirect(reverse('my_websites:home'))
    context = {'form': form}
    return render(request, 'users/register.html', context)
                                          

bootstrap

{% extends "pages/base.html" %}
{% load bootstrap5 %}

{% block header %}
<div="container my-5">
  <div class="bg-image position-relative rounded" style="background:url('https://wallpaperaccess.com/full/1708426.jpg') no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;  height: 100vh;">
    <div class="mask position-absolute rounded p-4 top-0 end-0 bottom-0 start-0" style="background-color: rgba(251, 251, 251, 0.8);">
      <h2 class="text-center display-6"> Register </h2>
      <form method="post" action="{% url 'users:register' %}" class="form text-dark" style="max-width: 400px; margin:0 auto;">
        {% csrf_token %}
        {% bootstrap_form form %}
        {% buttons %}
           <button name="submit" class="btn btn-dark">Register 
</button>
        {% endbuttons %}
        <input type="hidden" name="next" value="{% url 'my_websites:home' %}" />
      </form>
    </div>
  </div>
</div>

Спасибо, что уделили время.

Похоже, что вы используете Bootstrap, в котором предварительно определен набор CSS-классов, которые можно использовать для цветов.

Попробуйте изменить тег <h2 class="text-center display-6"> Register </h2> на <h2 class="text-center display-6 text-danger"> Register </h2> - скорее всего, он станет красным.

Дополнительную информацию о том, как использовать цвета в Bootstrap, включая определение собственной цветовой темы для использования, смотрите здесь: https://getbootstrap.com/docs/5.0/utilities/colors/ Удачи!

Вернуться на верх