前の
Djangoでbitflyerの収支管理アプリを作ってみる（02_02.ログイン画面を作る②。）
前回入力フィールドを作成したのですが、表示の体裁を整えるのをすっかり失念しておりました。
というわけで、今回はtableタグを使って見栄えを整えたりしていきます。
編集するのはlogin.htmlです。
login.html
{% load static %}
<!doctype html>
<html lang="ja">
<head>
<meta charset="uth-8">
<title>{{title}}</title>
{% comment %} <link rel="stylesheet" type="text/css"
href="{% static 'login/css/style.css' %}" /> {% endcomment %}
</head>
<body>
<h1>{{title}}</h1>
<p>{{message|safe}}</p>
<table>
<form action="{% url 'login' %}" method="post">
{% csrf_token %}
{{ form.as_table }}
<tr><td></td><td><input type="submit" value="click"></td></tr>
</form>
</table>
</body>
</html>
tableタグの追加と、
{{ form }}
↓
{{ form.as_table }}
と変更しています。
ではサーバーを起動して確認してみましょう。
>python manage.py runserver
ログイン画面にアクセスして表示を確認します。
http://localhost:8000/login/
入力フィールドが縦に並んで、すこし見栄えがよくなりました。
あ、ちなみにCSS読み込みがコメントアウトしたままこっそり置いてあります。
そのうち作るかもしれませんが、殺風景だなーと思われた方は自己責任で追加どうぞ。
では、次回は今度こそユーザー登録機能を実装していきますぞー。