如何用Flask安装CSS模板？

Question

我正在尝试使用此模板：http://www.free-css.com/free-css-templates/page185/flat-style#shout

这是我的文件目录：

app
    - static
      [--] css (inside static)
      [--] images (inside static)
      [--] js (inside static)
    - templates

但图像仍然无法正常加载： http://i.imgur.com/Mh71ko9.png

有人知道为什么图像不能正常加载吗？在

Answer 1

您只需将HTML从网站转储到templates文件夹中，图像和CSS的所有href和src属性仍然使用相对链接。这些需要转换为使用Flask的静态文件功能。在

例如，要使CSS正常工作，请更改以下行：

<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />

为此：

^{pr2}$

同样，对于图像，您可以更改：

<img src="images/logo.png" title="Flat style" />

到

<img src="{{ url_for('static', filename='images/logo.png') }}" title="Flat style" />

您需要对HTML中引用的所有静态文件执行此操作。在

请注意，您的Flask应用程序需要导入url_for

from flask import Flask, render_template, url_for