320x100
# 첫번째 파일
mysite > cars > templates > cars > rental_review.html
{% load static %}
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
<!-- JavaScript Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8" crossorigin="anonymous"></script>
<link rel="stylesheet" href="{% static 'cars/custom.css' %}"
<title>rental_review.html</title>
</head>
<body>
<h1>Rental review form</h1>
<div class='container'>
<form method="POST">
{% csrf_token %}
{% comment %}
as_p : p태그로 감싼 효과다.
as_table: table효과다
as_ul : ul태그로 감싼 효과다
{% endcomment %}
{% comment %} {{form.as_p}} {% endcomment %}
{% for field in form %}
<div class='mb-3'>
{{field.label_tag}}
</div>
{{field}}
{% endfor %}
<input type='submit'>
</form>
</div>
</body>
</html># 두번째 파일
mysite > cars > forms.py
from django import forms
class ReviewForm(forms.Form):
first_name = forms.CharField(label = 'First Name', max_length=100)
last_name = forms.CharField(label = 'Last Name', max_length=100)
email = forms.EmailField(label = 'Email')
review = forms.CharField(label = 'Please write your review here',
widget=forms.Textarea(attrs={
'class': 'myform',
'rows':'2',
'cols':'2'}))# 세번째 파일
mysite > cars > static > cars > custom.css
.myform{
border: 5px dashed red;
}
결과물로는 리뷰를 입력하는 텍스트박스쪽에 dashed로 영역 표시가 된
빨간색 박스를 볼 수 있다.
300x250
'개발일지 > Django' 카테고리의 다른 글
| Django - ModelForms 커스터마이징 (0) | 2022.10.01 |
|---|---|
| Django - ModelForms (0) | 2022.10.01 |
| Django - form 탬플릿 랜더링 (0) | 2022.10.01 |
| Django - form class 기초 (다음 포스팅과 연결될 예정) (1) | 2022.10.01 |
| Django - admin superuser생성 및 기본 다루기 (0) | 2022.10.01 |