django form 질문입니다!

조회수 4354회

회원가입 페이지를 다음과 같은 식으로 만들었습니다.

{% extends "base.html" %}
{% block title %}User Registration{% endblock %}
{% block head %}User Registration{% endblock %}
{% block content %}
    <form method="post" action=".">{% csrf_token %}
        <table border="0">
            {{ form.as_table }}
        </table>
        <input type="submit" value="Sign Up" />
    </form>
    <br>
    <a href="/login">Sign In</a>
{% endblock %}

이미지

여기서 {{ form.as_table }} 부분이 회원가입 부분을 나타내 주는데 CSS로 어떻게 접근해서 꾸밀 수 있는지 모르겠습니다. 예를들어 길이를 키우고 박스안에 placeholder도 넣고 모든 부분을 가운데로 갖고 오고 싶은데 어떻게 해야할까요? 그리고 옆에있는 username 이부분을 지우려면 어떻게 해야할까요? 고수님들 답변 부탁드립니다.

감사합니다.

  • (•́ ✖ •̀)
    알 수 없는 사용자

3 답변

  • <style>
    th{
            text-align: left;       
        }
    td{
            text-align: right;      
        }   
    </style>
    

    css를 넣는 방법은 많지만, 이렇게 추가할 수도 있습니다. 저 테이블에만 적용하고 싶다면, table에 class를 주면 될거구요.

    Placeholder는 form에서 이렇게 정의하시면 되겠네요.

    name = forms.CharField(widget=forms.TextInput(attrs={'placeholder': 'Name'}))
    
    • 답변감사합니다. 제가 잘 몰라서 그런데 말씀주신 style을 제 코드 어느부분에 넣어야지 적용이 가능할까요? 알 수 없는 사용자 2016.5.17 13:58
    • head에 넣으면 됩니다. 정토드 2016.5.18 05:38
  • 링크를 참고해보세요.

    예시:

    from django import forms
    
    class AuthenticationForm(forms.Form):
        username = forms.CharField(
            max_length=254,
            widget=forms.TextInput(attrs={'class': "input-lg"}),
        )
        password = forms.CharField(widget=forms.PasswordInput)
    

    위에서 username 폼필드를 보면 widget을 TextInput으로 정하는 데, 속성에 class(CSS)를 주는 방법이 있습니다.

    위와 같은 모든 폼 필드에 원하는 CSS를 적용해보세요.

    그리고 usernmae:은 폼필드에서 label을 지정한 것인데, label='' 으로 주면 될것 같습니다.

    예시:

    from django import forms
    
    class AuthenticationForm(forms.Form):
        username = forms.CharField(
            max_length=254,
            widget=forms.TextInput(attrs={'class': "input-lg"},label=''),
        )
        password = forms.CharField(widget=forms.PasswordInput)
    
  • 두분 다 답변 감사합니다!

    • (•́ ✖ •̀)
      알 수 없는 사용자

답변을 하려면 로그인이 필요합니다.

프로그래머스 커뮤니티는 개발자들을 위한 Q&A 서비스입니다. 로그인해야 답변을 작성하실 수 있습니다.

(ಠ_ಠ)
(ಠ‿ಠ)