当前位置: 首页 > 面试题库 >

应用程序未获取.css文件(flask/ python)

郑嘉年
2023-03-14
问题内容

我正在渲染一个模板,尝试使用外部样式表进行样式设置。文件结构如下。

/app
    - app_runner.py
    /services
        - app.py 
    /templates
        - mainpage.html
    /styles
        - mainpage.css

mainpage.html看起来像这样

<html>
    <head>
        <link rel= "stylesheet" type= "text/css" href= "../styles/mainpage.css">
    </head>
    <body>
        <!-- content --> 

我的样式均未应用。它与html是我正在渲染的模板有关吗?python看起来像这样。

return render_template("mainpage.html", variables..)

我知道这很有效,因为我仍然能够渲染模板。但是,当我尝试将样式代码从html的“ head”标记中的“样式”块移动到外部文件时,所有样式消失了,仅留下了一个html页面。有人看到我的文件结构有任何错误吗?


问题答案:

你需要有一个“静态”文件夹设置(用于css / js文件),除非你在Flask初始化期间专门覆盖了它。我假设你没有覆盖它。

你的CSS目录结构应类似于:

/app
    - app_runner.py
    /services
        - app.py 
    /templates
        - mainpage.html
    /static
        /styles
            - mainpage.css
        -

请注意,你的/ styles目录应位于/ static下

然后做

<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='styles/mainpage.css') }}">

Flask现在将在static / styles / mainpage.css下查找css文件



 类似资料:
  • 问题内容: 我正在渲染一个模板,尝试使用外部样式表进行样式设置。文件结构如下。 mainpage.html看起来像这样 我的样式均未应用。它与html是我正在渲染的模板有关吗?python看起来像这样。 我知道这很有效,因为我仍然能够渲染模板。但是,当我尝试将样式代码从html的“ head”标记中的“样式”块移动到外部文件时,所有样式消失了,仅留下了一个html页面。有人看到我的文件结构有任何错

  • 问题内容: 我正在开发Flask扩展名,我想从该扩展名在文件系统上项目的根路径中创建目录。 假设我们有这个目录结构 my_folder应该由扩展名动态创建,扩展名是一个测试实用程序,并将被测试的应用程序包装在/ tests目录中。但是,我正在努力确定扩展中项目的根路径。 现在,我试图从运行文件中猜测路径: 一旦在IDE中而不是manage.py中运行测试,这显然会中断。我可以简单地推断出相对于ap

  • 主要内容:调试模式要测试Flask安装是否成功,在编辑器中输入以下代码,并保存到文件: 中。 在项目中导入模块是强制性的。 Flask类的一个对象是WSGI应用程序。 Flask构造函数将当前模块的名称()作为参数。 Flask类的函数是一个装饰器,它告诉应用程序哪个URL应该调用相关的函数。 rule 参数表示与该函数绑定的URL。 options 是要转发给底层Rule对象的参数列表。 在上面的例子中, URL

  • 问题内容: 我的Flask应用程序结构如下所示 当我运行时,它将在处启动服务器。在我,我尝试打开该文件作为 它给出了错误 如何访问此文件? 问题答案: 认为问题出在你/的道路上。删除,/因为与处于同一级别。 我建议将水平设置为或许多Flask用户喜欢使用,但我不喜欢。 如果这是你要设置的方式,请尝试以下操作: 现在,你可以轻松执行以下操作: 根据需要调整路径和级别。

  • 问题内容: 有没有办法在Spring应用程序中静态/全局地请求ApplicationContext的副本? 假设主类启动并初始化了应用程序上下文,它是否需要通过调用堆栈将其向下传递给需要它的任何类,或者是否有一种方法可以让类要求先前创建的上下文?(我认为必须是单身人士?) 问题答案: 如果需要访问容器的对象是容器中的Bean,则只需实现BeanFactoryAware或ApplicationCon

  • 我正在使用CreateReact应用程序引导我的应用程序。 我添加了两个文件和。 我的包括: 当我使用