テンプレートを利用しよう (4/6)
作成:2017-12-23 08:43
更新:2017-12-23 08:43
更新:2017-12-23 08:43
■スタイルシートを使う
一応、これで表示だけはできましたが、ページの表示に単にHTMLファイル1つだけしか使わない、ということはあまりないでしょう。普通は、スタイルシートやJavaScriptファイルなどを組み合わせて表示をしているはずです。
こうしたスタイルシートファイルやJavaScriptファイルは、「スタティックファイル」と呼ばれるものです。これは、テンプレートとは少し扱いが違います。Djangoでは、スタティックファイルはあらかじめ用意されたフォルダにまとめておくことになっているのです。
スタティックファイルは、各アプリケーションフォルダ内に「static」フォルダを作り、その中に配置します。――では、「hello」フォルダを開き、その中に「static」という名前のフォルダを作成して下さい。そして、この「static」を開き、その中に更に「hello」というフォルダを作って下さい。
この中に、「style.css」という名前でテキストファイルを作りましょう。そして下のリスト欄のようにスタイルシートを記述しておきます。ここでは、サンプルとしてh1のスタイルを書いてあるだけですが、もちろんその他のスタイルも用意して構いません。
ここではスタイルシートを用意していますが、その他のスタティックファイル(JavaScriptファイルやイメージファイルなど)も、同様に「static」フォルダの中に配置していきます。
こうしたスタイルシートファイルやJavaScriptファイルは、「スタティックファイル」と呼ばれるものです。これは、テンプレートとは少し扱いが違います。Djangoでは、スタティックファイルはあらかじめ用意されたフォルダにまとめておくことになっているのです。
スタティックファイルは、各アプリケーションフォルダ内に「static」フォルダを作り、その中に配置します。――では、「hello」フォルダを開き、その中に「static」という名前のフォルダを作成して下さい。そして、この「static」を開き、その中に更に「hello」というフォルダを作って下さい。
この中に、「style.css」という名前でテキストファイルを作りましょう。そして下のリスト欄のようにスタイルシートを記述しておきます。ここでは、サンプルとしてh1のスタイルを書いてあるだけですが、もちろんその他のスタイルも用意して構いません。
ここではスタイルシートを用意していますが、その他のスタティックファイル(JavaScriptファイルやイメージファイルなど)も、同様に「static」フォルダの中に配置していきます。
(by. SYODA-Tuyano.)
※プログラムリストが表示されない場合
AddBlockなどの広告ブロックツールがONになっていると、プログラムリスト等が表示されない場合があります。これらのツールをOFFにしてみてください。
●プログラム・リスト●
1 2 3 4 5 | h 1 { font-size : 16pt ; font-weight : bold ; color : red ; } |
※関連コンテンツ