无法从外部css更改css



我一直试图使用外部样式表更改html的css,但在编辑main.css时没有任何更改。当我第一次添加main.css的时候,网页的css使用初始css,但之后我无法进行任何更改。

这些是我的参考代码:

<head>
<title>{{title}}</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" href="{{ url_for('static',filename='css/main.css')}}" />
</head>

这些是我的main.css:代码

html,
body {
font-family: Arial, Helvetica, sans-serif;
height: 100%;
position: relative;
margin:0px;
}
header {
text-align: center;
border-bottom: 1px solid #837373;
margin-bottom: 20px;
}
hr {
width: 100%;
height:1px;
margin-left: auto;
margin-right: auto;
background-color: darkblue;
border: 0 none;
}
input[type=text] {
display: inline-block;
border: none;
background: #f1f1f1;
}
input[type=text]:focus {
background-color: #ddd;
outline: none;
}
.top-container {
background: #d1d1d1;
padding:5px;
border-bottom:2px solid #0f0f0f;
}
.bottom-container {
background: black;
padding:5px;
border-top:2px solid #0f0f0f;
/* position:absolute; */
bottom:0;
}
footer {
text-align: center;
height: 50px;
color: white;
padding: 5px;
margin-top: 10px;
bottom: 0px;
}
.error-message {
color :red;
}

因此,例如,我的网页现在显示了上面显示的main.css的css样式,但现在我无法进行任何更改,例如,当我将背景更改为红色时,它不会更改。我认为这与静电有关?

由于文件名没有更改,浏览器一直认为它是同一个文件,因此从缓存加载第一个下载的文件并使用它。

让浏览器下载并使用新文件(即使它有类似的名称(称为缓存总线
在使用Apache服务器时,我建议使用mod_rewrite,但请记住,使用许多.htaccess-文件会大大降低服务器的速度,因此最好直接在httpd.conf-文件中配置此类重写。

最新更新