Question

我正在通过Learn Python The Hard Way工作，目前正在练习练习51.在其中，要求学生尝试使用web.py框架构建一些基本的Web应用程序。第一项研究是提高HTML布局的质量，以便应用程序构建在格式良好的页面上。我希望制作一个适用于应用程序中所有页面的模板布局，并利用CSS样式表来提供格式。我希望CSS格式是外部的，而不是HTML文件。出于某种原因，无论我如何格式化'main_layout.css'的路径，我都无法使格式更改生效。我已尝试使用前导'/'并且没有前导'/'的路径。我已经尝试将CSS文件移动到另一个文件夹（根文件夹和模板文件夹）。我试图清空我的浏览器缓存，以防出现问题。我尝试直接通过我的浏览器访问'static'目录和'main_layout.css'文件本身，我在两种情况下都能做到 - 文件就在那里，但我无法接受格式化来自'main_layout.css'的标记。我搜索了这个问题，检查了谷歌群组的web.py，并搜索了stackoverflow - 在所有情况下，答案都与css文件的路径有关，我相信我已经充分探索并试图修复无济于事。我已经尝试了我可以在网上找到的所有建议，而且我很难过。我的代码如下：

/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运行此脚本，并通过Google Chrome在http://localhost:8080/hello访问它。

Answer 1

您正在使用octothorp（＃）注释CSS文件，这对于CSS文档是不正确的（但对于Python来说是正确的，这是混乱的地方）。使用/ *在CSS文档中注释掉您的代码。像这样：

＆＃13;

.container /*body_container*/ {
    margin: 10px auto;
    padding-bottom: 50px;
    min-height: 100%;
    text-align: center;
    overflow: auto;
    }

＆＃13;

是什么阻止我在web.py框架中使用CSS样式表？

1 个答案: