演習課題「共通テンプレートを利用する」
右の環境には、「myblog」プロジェクトに「diary」という1行掲示板が作成してあります。
このアプリケーションの共通テンプレート(base.html)のコンテンツのところを、
Bootstrapのコンテナを利用するように修正してください。
採点して、すべてのジャッジに正解すれば、演習課題クリアです!
※ 採点時は、サーバーを起動し、問題文に関するページにアクセスできる状態にしてください。
#03:掲示板にBootstrapを適用しよう
ここでは、Djangoで作る掲示板アプリケーションに、HTMLテンプレートのBootstrapを適用します。Bootstrapを利用すると、Webアプリケーションのデザインを簡単にレベルアップさせることができます。
myapp/bbs/templates/bbs/base.html<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width, initial-scale=1, shrink-to-fit=no'>
<title>paiza bbs</title>
<link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css' >
<style>body {padding-top: 80px;}</style>
</head>
<body>
<nav class='navbar navbar-expand-md navbar-dark bg-dark fixed-top'>
<a class='navbar-brand' href='{% url "bbs:index" %}'>paiza bbs</a>
</nav>
<div class='container'>
{% block content %}
{% endblock %}
</div>
</body>
</html>
- Python Django入門 (4) - Qiita
https://qiita.com/kaki_k/items/6e17597804437ef170ae
- Python Django チュートリアル(6) - Qiita
https://qiita.com/maisuto/items/86add9263a641899b1e3
- Django の概要 - テンプレートを設計する
https://docs.djangoproject.com/ja/2.1/intro/overview/#design-your-templates
- テンプレート | Django documentation | Django
https://docs.djangoproject.com/ja/2.1/topics/templates/