HTML代码如下所示

<代码><；DIV类="；项目添加"；>；<；DIV类="；模糊"；>；<；/DIV>；<；/DIV>；

CSS代码为：

<div class="itemadd">
        <div class="blur">
        </div>
</div>

我已经检查了文件和文件夹的名称是否正确，并且在编写代码时没有输入错误。

然而，如果我尝试通过HTML代码隐式添加背景图像，它可以工作，但这会导致问题，因为我无法添加线性渐变属性。

我也在VS代码中编写了它，它在那里工作得很好，但在JSP Eclipse

编辑：我试着像这样写我的CSS代码：

.itemadd {
        position: relative;
        width: 100%;
        height: 100vh;
        background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(image/home.jpg);
        background-size: cover;
    }
    .blur {
        width: 100%;
        height: 100vh;
        backdrop-filter: blur(8px);
    }

仍然没有得到解决。我正在附加我的项目的文件夹结构。我正在处理的CSS文件是menuadd.CSS（它在文件夹中突出显示）。我的CSS连接到我的HTML页面。所有的CSS代码都运行良好，除了我上面写的代码。

顺晟科技：

尝试解决方案之前，请浏览下面的图片和提供的链接。

参考链接：https：//www.w3schools.com/css/css_howto.asp.

注意：首先要了解层次结构，因为JSP/HTML页面都带有WebApp文件夹，Image文件夹包含图像，CSS文件夹包含CSS文件。“image/home.JPG” URL将在JSP和HTML页面中工作，因为它们不存储在任何子文件夹中，但当您尝试从CSS文件夹访问图像时，层次结构会发生变化，您将从CSS文件夹访问图像文件夹，因此首先您将得到由“./”

试试这个：

内部MenuAdd.CSS：

 .itemadd {
            position: relative;
            width: 100%;
            height: 100vh;
            background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url('./image/home.jpg');
            background-size: cover;
        }
.blur{
       width: 100%;
       height: 100vh;
       backdrop-filter: blur(8px);
     }

JSP中：

.itemadd {
position: relative;
width: 100%;
height: 100vh;
background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(../image/home.jpg);
background-size: cover;
  }

.blur {
width: 100%;
height: 100vh;
 backdrop-filter: blur(8px);
      }