JSP 忽略了一些 CSS答案

【问题标题】：JSP ignores some cssJSP 忽略了一些 CSS
【发布时间】：2023-09-03 08:51:01
【问题描述】：

我的 java web 应用程序有问题。

我有一个页面和一个 CSS。 CSS 链接正确，jsp 可以看到。但是添加了一些新样式之后，jsp就忽略了。

有人遇到过同样的问题吗？

这就是jsp头

<head>
        <meta charset="UTF-8">
        <title>Title</title>
        <link rel="stylesheet" href="styles/mainStyle.css"/>
        <link rel="stylesheet" href="styles/buyingTicket.css"/>
        <style type="text/css">
            #bus{
                background-image: url("pictures/bus-disabled-buyingPage.png");
            }
            #tram{
                background-image: url("pictures/train-disabled-buyingPage.png");
            }
            #troll{
                background-image: url("pictures/trolleybus-disabled-buyingPage.png");
            }
            #metro{
                background-image: url("pictures/metro-disabled-buyingPage.png");
            }
        </style>

这是一个css的例子。

#tram{
    background-size: cover;
    background-image: url("pictures/bus-disabled-buyingPage.png");
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

我必须在 jsp head 中添加样式才能让它工作，现在我所有的 jsp 都会发生这种情况。我必须添加新样式不是ccs，而是jsp的头。

【问题讨论】：

你在 css 中添加了什么？你在哪个css中添加了一些东西？可能的问题是在浏览器中缓存（尝试 F5）或覆盖 css（buyingTicket.css 覆盖具有相同 ids/attributes/names 的 mainStyle.css 的布局）。
mainStyle 和buyingTicket 不会相互覆盖。我在buyingTicket 中添加了背景图片，但是jsp 看不到它。连jsp风格的head都不行。必须给我们 js - window.onload 函数来设置那些图像。缓存不是答案。 F5 根本不起作用。会不会是tomcat的问题？
如果缓存有问题，请使用 Control + Shift + R 重新加载页面，而不使用缓存项目。
确保您的新文件已部署到服务器：检查您的 tomcat 的 webapps 文件夹中的 css 文件是否包含您的更改。
我不这么认为。您确定您使用的背景图片的 URL 与 onload javascript 函数中的 URL 相同吗？

标签： java css jsp tomcat web

【解决方案1】：

嫌疑人：缓存、文件位置、错误语法

缓存：

缓存可能很棘手。只是为了确定它是否是缓存。

检查styles/mainStyle.css 和styles/buyingTicket.css 的链接是否可以直接在您的浏览器中访问。
检查指向背景图片的链接pictures/bus-disabled-buyingPage.png ...
按 CTRL+F5 看看有什么不同。（如果是这样，缓存就是问题）
在不同的浏览器/设备中尝试。
某些浏览器插件可能会干扰，请尝试将浏览器置于安全模式。

文件位置：

检查您的工作区，是否有多个同名文件。
清理并重新部署

错误的语法：

您的某些文件中的语法也可能有误。验证内容：

CSS：http://www.css-validator.org/
HTML：https://validator.w3.org/

【讨论】：

非常感谢详细的答案，去试试这些。