flask加载网页时css美化效果加载不出来的解决方法

3 篇文章 0 订阅
3 篇文章 0 订阅

前言

问题:
直接打开网页就有css的美化效果,运行flask出来后就没有,网上找了半天之后找到了解决方案,在此记录一下,方便以后查找。

环境:
vscode、python

步骤

  1. 在主项目文件夹“weather_project”下面创建一个“static”文件夹存放图片、css、js等文件,此时我将美化主页面的login.css文件存在“static”文件夹下面的“css”文件夹里

  2. flask响应后进入的主页面文件login.html存放在“templates”文件夹

  3. flask.py 文件直接存放在主项目文件夹“weather_project”里面
    在这里插入图片描述

  4. 在flask.py 文件里面导入库from flask import Flask,url_for
    在这里插入图片描述

  5. 然后在login.html 文件里面修改代码
    我原本加载css文件的代码是这样的:

<link rel="stylesheet" href="../login.css"/>

把它改成:

<!-- 引入 css文件 -->
        <link rel="stylesheet" type="text/css" href= "{{ url_for('static', filename = 'css/login.css') }}">

用url_for函数来导入css文件就不会出错了
其中“filename”填写存放css文件的相对路径即可

综上,问题解决

参考文章

flask导入一个模板加CSS js

  • 12
    点赞
  • 47
    收藏
    觉得还不错? 一键收藏
  • 8
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 8
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值