尽管我在 css 文件中进行了一些更改，但我遇到了样式没有改变的问题答案

【问题标题】：I had a problem that the styles do not change although I made some changes in css file尽管我在 css 文件中进行了一些更改，但我遇到了样式没有改变的问题
【发布时间】：2021-06-16 16:23:16
【问题描述】：

我的文件夹结构

Food Delivery App/
  app.py
  static/
    stylesheets/
      base.css
  templates/
    base.html

base.css

html {
    min-height: 100%;
    min-width:100%;
}
body {
    width:100%;
    min-height: 100%;
    min-width:600px;
    padding-top: 60px;
    margin: 0 auto;
    padding-right:0;
    overflow-x: hidden;
}
.navbar{
    background-color:skyblue;
}
.nav-link{
    padding-left:20px;
    padding-right:20px;
}
.form-inline{
    padding-left:50px;
    padding-right:20px;
}
.login_btn{
    padding-left:50px;
}

base.html

<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='stylesheets/base.css') }}" />
{% block head %} 
{% endblock %}
</head>
<body>
    <nav class="navbar fixed-top navbar-expand-lg">
        <a class="navbar-brand"><a class="nav-link" href="#homepage">
            <img src="{{ url_for('static',filename='images/ufood.png')}}" alt="ufood logo" width="50" height="50">
        </a>
          <div class="collapse navbar-collapse justify-content-end" id="navbarNav">
            <ul class="navbar-nav navbar_options">
                <li class="nav-item"><a class="nav-link" href="">About</a></li>
                <li class="nav-item"><a class="nav-link" href="">Mission</a></li>
                <li class="nav-item"><a class="nav-link" href="">Menu</a></li>
                <li class="nav-item"><a class="nav-link" href="">Restaurants</a></li>
                <li class="nav-item"><a class="nav-link" href="">Contact</a></li>
            </ul>
            <form class="form-inline">
                <input type="text" class="form-control mr-2 search_food" placeholder="Browse by cuisines">
                <button class="btn btn-info" type="submit">Search</button>
            </form>
           <a class="login_btn" href="">Login</a>
        </div>
    </nav>
    <div id="content">
        {% block content %}{% endblock %}
    </div>
    
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
</body>

app.py

from flask import Flask,render_template
from flask_bootstrap import Bootstrap


app = Flask(__name__)
Bootstrap(app)

@app.route('/')
def index():
    return render_template('homepage.html')

if __name__ == '__main__':
    app.run()

我有一个问题，当我在 base.css 中进行任何更改并运行 python 脚本时，base.html 模板不会根据 css 文件中设置的样式进行更新。请问有什么我错过的技巧，因此模板无法根据 css 文件遵循样式吗？例如，我保存了将背景色 .navbar 设置为天蓝色的 css 文件，但是当我刷新 Web 模板时，它仍然显示黑色而不是天蓝色。填充也没有相应地遵循我错过的问题吗？

【问题讨论】：

标签： python html css flask web

【解决方案1】：

问题原因：当您刚刚刷新 Web 模板时，所有静态文件都刚刚进入您的浏览器缓存。

问题解决方案：尝试使用硬重新加载刷新网页，以便重新加载所有模板和 CSS。

在相应的系统中尝试以下命令，而不是 Refresh(F5)：

Windows 用户：按住 Ctrl，然后按键盘上的 F5。 Mac 用户：按住 Cmd 和 Shift 键，然后按键盘上的 R。

【讨论】：