私は Learn Python The Hard Way に取り組んでおり、現在は課題 51 に取り組んでいます。この課題では、学生は web.py フレームワークを使用していくつかの基本的な Web アプリケーションを構築するように求められます。最初の学習ドリルは、HTML レイアウトの品質を改善して、アプリケーションが適切にフォーマットされたページ上に構築されるようにすることです。アプリケーションのすべてのページに適用されるテンプレート レイアウトを作成し、CSS スタイルシートを利用して書式設定を提供しようとしています。CSS フォーマットを HTML ファイル内ではなく、外部に設定したいと考えています。何らかの理由で、「main_layout.css」へのパスをどのようにフォーマットしても、フォーマットの変更を有効にすることができません。先頭に「/」を付けて、先頭に「/」を付けずにパスを試しました。CSSファイルを別のフォルダー(ルートフォルダー、およびテンプレート フォルダー)。問題が発生している場合に備えて、ブラウザのキャッシュを空にしてみました。「静的」ディレクトリと「main_layout.css」ファイル自体にブラウザから直接アクセスしようとしましたが、どちらの場合もアクセスできました-ファイルはそこにありますが、フォーマットを受け入れることができません「main_layout.css」からのマークアップ。私はこの問題をグーグルで検索し、web.py のグーグル グループをチェックし、stackoverflow を検索しました。すべての場合において、答えは css ファイルへのパスに関連していました。私はウェブ上で見つけることができるすべての提案を試しましたが、困惑しています. 私のコードは次のとおりです。どちらの場合もブラウザからファイル自体を直接ダウンロードできました。ファイルはそこにありますが、「main_layout.css」からの書式設定マークアップを受け入れることができません。私はこの問題をグーグルで検索し、web.py のグーグル グループをチェックし、stackoverflow を検索しました。すべての場合において、答えは css ファイルへのパスに関連していました。私はウェブ上で見つけることができるすべての提案を試しましたが、困惑しています. 私のコードは次のとおりです。どちらの場合もブラウザからファイル自体を直接ダウンロードできました。ファイルはそこにありますが、「main_layout.css」からの書式設定マークアップを受け入れることができません。私はこの問題をグーグルで検索し、web.py のグーグル グループをチェックし、stackoverflow を検索しました。すべての場合において、答えは css ファイルへのパスに関連していました。私はウェブ上で見つけることができるすべての提案を試しましたが、困惑しています. 私のコードは次のとおりです。私は完全に調査し、無駄に修正しようとしたと信じています.Webで見つけることができるすべての提案を試しましたが、困惑しています. 私のコードは次のとおりです。私は完全に調査し、無駄に修正しようとしたと信じています.Webで見つけることができるすべての提案を試しましたが、困惑しています. 私のコードは次のとおりです。
/bin
app.py
/ex51
/static
main_layout.css
/templates
hello_form.html
index.html
layout.html
/tests
app.py は次のように記述します。
import web
urls = (
'/hello', 'Index'
)
app = web.application(urls, globals())
render = web.template.render('templates/', base="layout")
class Index(object):
def GET(self):
return render.hello_form()
def POST(self):
form = web.input(name="Nobody", greet="Hello")
greeting = "%s, %s" % (form.greet, form.name)
return render.index(greeting = greeting)
if __name__ == "__main__":
app.run()
index.html は次のように記述します。
$def with (greeting)
$if greeting:
I just wanted to say <em style="color: green; font-size: 2em;">$greeting</em>
$else:
<em>Hello</em>, world!
hello_form.html は次のように記述されます。
<h1>Fill out this form</h1>
<form action="/hello" method="POST">
A Greeting: <input type="text" name="greet">
<br/>
Your Name: <input type="text" name="name">
<br/>
<input type="submit">
</form>
main_layout.css は次のように記述されます。
html, body {
height: 100%;
}
.container {
width:800px;
}
.container #body_container {
margin: 10px auto;
padding-bottom: 50px;
min-height: 100%;
text-align: center;
overflow: auto;
}
.container #footer_container {
margin-top: -50px;
height: 50px;
}
そしてlayout.html:
$def with (content)
<html>
<head>
<link rel="stylesheet" type="text/css" href="/static/main_layout.css" />
<title>This is My Page</title>
</head>
<body>
<div class="container" id="body_container">
$:content
</div>
<div class="container" id="footer_container">
Hello World
</div>
</body>
</html>
よろしくお願いします。
編集: 追加情報として、Windows 7 PC の PowerShell からこのスクリプトを実行し、http://localhost:8080/hello
Google Chrome 経由でアクセスしています。