[分享]css中img不在根目录

在大多数情况下，我们会将网站开发的CSS文件放在根目录中，而图片则会放在一个独立的文件夹中。但是，在某些情况下，我们需要将图片放在一个不同的位置，也就是不在根目录中。这时候就需要对CSS文件做一些修改...

在大多数情况下，我们会将网站开发的CSS文件放在根目录中，而图片则会放在一个独立的文件夹中。但是，在某些情况下，我们需要将图片放在一个不同的位置，也就是不在根目录中。这时候就需要对CSS文件做一些修改。

首先，我们需要使用相对路径来引用这些图片。相对路径是指以当前样式文件的位置为起点，根据相对于当前位置的层数来定位文件的路径。例如，如果我们将图片存放在CSS文件的同级目录中，我们可以使用../来引用：

img {
    background-image: url("../images/logo.png");
} 

如果图片存放在CSS文件的上一层目录中，则应该加上../，如下所示：

img {
    background-image: url("../../images/logo.png");
} 

当然，如果图片存放在更高的目录中，我们也可以这样写：

img {
    background-image: url("../../../images/logo.png");
} 

这样做可以确保代码的可读性和可维护性。如果我们使用绝对路径来引用图片，将会造成代码混乱，不利于代码的维护和管理。

总之，为了使CSS文件能够轻松地找到位于其他目录中的图片，我们需要使用正确的相对路径。我们可以使用../表示相对于当前样式文件所在的目录，也可以使用../../表示相对于当前目录的上一层目录，以此类推。相对路径的使用可以使代码更加清晰和易于维护。