Question

我已经完成了css文件的编辑并保存了
但我的css文件不起作用，根本不改变显示
和CSS文件也未加载

但是我将css文件重命名后，一切正常载入css文件并更改显示

我的文件夹结构有问题吗？
还是我的编码有问题？

我的自定义CSS是

<link rel="stylesheet" href="../style/index.css">

这是我的头像

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="../css/bootstrap.min.css">
    <!-- Custom CSS -->
    <link rel="stylesheet" href="../style/index.css">
    <link rel="stylesheet" href="../css/pace.css">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="../css/fontawesome.css">
    <title>Dashboard • Sistem Pakar</title>
</head>

我的文件夹结构
行动/
| ---.....
|
资产/
| ---.....
|
css /
| ---.....
|
js /
| ---.....
|
lib /
| ---.....
|
风格/
| --- index.css
|
app /
| --- index.php

Answer 1

如果您遇到的问题是要更改CSS代码，但更改不会反映在浏览器上。这是因为浏览器会缓存您的CSS，并且不会从服务器（文件）中重新加载它。要手动重新加载它，您需要：

按ctrl + F5重新加载页面
使用一些扩展名清除浏览器的缓存
重命名CSS文件名，以便浏览器可以加载新文件
使用诸如grunt等的任务运行程序丑化并重命名您的CSS

为方便起见，您可以尝试上述任何一种方法

Answer 2

网络浏览器或网络服务器的缓存是发生情况的原因，您可以像这样在css文件之后使用字符串，并且每次更改后，都可以更改版本，它将起作用。

    <link rel="stylesheet" href="../style/index.css?ver=1.0.0">

请注意，查询字符串（?之后的uri部分）可以是任何内容，只要它是有效的查询字符串，并且每次更改都不同即可。

Answer 3

一个有用的窍门是“ 禁用缓存”浏览器功能。听起来不错，它在打开DevTools时禁用了缓存。

更多信息在这里：https://stackoverflow.com/a/7000899/4614064

此外，如果使用Webpack或Gulp，则可以使用散列输出不同的文件名，因此浏览器必须正确地重新加载它。在开发中，浏览器中的“禁用缓存”应该足够。

为什么我必须重命名css文件，以便它可以工作，有什么问题吗？

3 个答案: