【问题标题】:How to use "css" in the "jsp" in Spring MVC project?如何在 Spring MVC 项目的“jsp”中使用“css”?
【发布时间】:2023-03-22 07:38:02
【问题描述】:

我正在开发一个 Spring MVC 项目,在该项目中我试图通过引用 css 样式表来设计我的 JSP 页面。但是不知何故,一旦我在控制器中点击我的方法,我的 css 文件就没有被拾取..

下面是我的 JSP 文件 -

<html>
<head>
<link rel="stylesheet" type="text/css" href="test.css" />
</head>

<body>

<h1>All header 1 elements will be red</h1>
<h2>All header 2 elements will be blue</h2>
<p>All text in paragraphs will be green.</p>

</body>
</html>

下面是我的test.css 文件 -

h1 {color:red;}
h2 {color:blue;}
p {color:green;}    

下面是我在控制器类中的方法 -

@RequestMapping(value = "testing", method = RequestMethod.GET)
public Map<String, String> testing() {

    final Map<String, String> model = new LinkedHashMap<String, String>();

    return model;
}

目录结构是这样的——

webapp/
|-- 资源/
| +-- css/
|测试.css
+- 网络信息/
  +-- 意见/
        testing.jsp

但不知何故它对我不起作用..我在这里做错了什么吗?

更新:-

这是我的 web.xml 文件-

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
  <display-name>testweb</display-name>
  <listener>
    <listener-class>com.host.webres.resource.env.EbayResourceRuntimeListener</listener-class>
  </listener>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
    <welcome-file>index</welcome-file>
  </welcome-file-list>
  <servlet>
    <servlet-name>appServlet</servlet-name>
    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
    <init-param>
      <param-name>contextConfigLocation</param-name>
      <param-value>/WEB-INF/spring/context.xml</param-value>
    </init-param>
    <load-on-startup>1</load-on-startup>
  </servlet>
  <servlet-mapping>
    <servlet-name>appServlet</servlet-name>
    <url-pattern>/testweb/*</url-pattern>
  </servlet-mapping>
</web-app>

下面是我的context.xml 文件-

<?xml version="1.0" encoding="UTF-8"?>
<beans:beans xmlns="http://www.springframework.org/schema/mvc"
    xmlns:mvc="http://www.springframework.org/schema/mvc"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns:beans="http://www.springframework.org/schema/beans"
    xmlns:context="http://www.springframework.org/schema/context"
    xmlns:aop="http://www.springframework.org/schema/aop"
    xmlns:task="http://www.springframework.org/schema/task"
    xsi:schemaLocation="
        http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-3.1.xsd
        http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.1.xsd
        http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.1.xsd
        http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-3.1.xsd
        http://www.springframework.org/schema/task http://www.springframework.org/schema/task/spring-task-3.1.xsd">

    <!-- DispatcherServlet Context: defines this servlet's request-processing infrastructure -->

    <!--  Allow proxys -->
    <aop:aspectj-autoproxy />

    <!-- Enables the Spring MVC @Controller programming model -->
    <mvc:annotation-driven>
            <mvc:message-converters>
              <!--  Support AJAX processing with progressive rendering. Overrides HttpOutputMessage with RaptorResponseWriter -->
            <beans:bean class="com.host.terr.kernel.filter.RaptorJacksonHttpMessageConverter"/>                 
            </mvc:message-converters>
    </mvc:annotation-driven>

    <context:component-scan base-package="com.host.terr.config" />
    <context:component-scan base-package="com.host.personalization.bullseye.zookeeper.p13nzook.controller" />       

    <!-- Handles HTTP GET requests by efficiently serving up static resources 
         in the corresponding directory -->
    <resources mapping="/js/**" location="/js/" />
    <resources mapping="/css/**" location="/css/" />

    <!-- Resolves views selected for rendering by @Controllers to .jsp resources in the /WEB-INF/views directory -->
    <beans:bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <beans:property name="prefix" value="/WEB-INF/views/" />
        <beans:property name="suffix" value=".jsp" />
    </beans:bean>
</beans:beans>

这是我在控制台上遇到的异常,但浏览器显示的数据没有任何 css -

404 /testweb/test.css Not Found /testweb/test.css Not Found }, Correlations : {} }

【问题讨论】:

  • 为什么不用Spring的resources标签?
  • @Reimeus:你什么意思?如果可能的话,你能提供一个例子吗?我最近开始使用 Spring MVC 的东西..
  • @SSH

标签: java css spring jsp spring-mvc


【解决方案1】:

在您的 servlet-context.xml 文件中,您可以设置资源目录。在您的情况下,需要更改

<resources mapping="/resources/**" location="/resources/"/>

在你的jsp页面中,如下所示,

<link rel="stylesheet" type="text/css" href="
      <c:url value="/resources/css/test.css"/> "/>

我希望它会起作用

【讨论】:

  • 我只需要修改jsp页面以包含您提到的css路径吗?就这些?
  • 这是我得到的例外 - /testweb/%3Cc:url%20value= Not Found /testweb/%3Cc:url%20value= Not Found 尝试后。
  • 我用 servlet-context.xml 文件更新了我的问题。
【解决方案2】:

您需要提供上下文路径。

 <link rel="stylesheet" href="${pageContext.request.contextPath}/resources/css/test.css" />

What does this expression language ${pageContext.request.contextPath} exactly do in JSP EL?

【讨论】:

    【解决方案3】:

    您需要将&lt;base/&gt; 设置为如下...

    <c:set var="req" value="${pageContext.request}" />
    
    <c:set var="url"> ${req.requestURL} </c:set>
    <c:set var="uri" value="${req.requestURI}" />
    
    <head>
        <title></title>
        <base href="${fn:substring(url, 0, fn:length(url) - fn:length(uri))}${req.contextPath}/" />
    

    然后你可以像下面这样导入任何 JS 或 CSS..

    <script src="assets/js/angular/angular.js"></script>
    

    【讨论】:

      【解决方案4】:

      也许通过将您的 .css 文件添加到 WEB-Content 内的特定文件夹中,您可以使用属性 href = "yourFolder/yourFile.css 事实上,像视图这样的所有“网络”资源都应该在那里(即 jsp、css。)。 您还可以通过添加以下内容来确定您的链接(在 .jsp 文件中)是一个样式表:rel="stylesheet"

      你会有一个如下所示的链接:

      【讨论】:

        【解决方案5】:

        这个css资源问题

        请在下面试试

         <link rel="stylesheet" type="text/css" href="css/test.css" />
        

        如果被 Bowaser 加载,你可以看到这个资源。

        【讨论】:

        • 这个怎么样?
        • 您可以尝试将 test.css 复制到 webapp 文件夹并尝试一下。也许它可以工作。
        猜你喜欢
        • 2017-02-14
        • 2014-12-04
        • 1970-01-01
        • 1970-01-01
        • 2016-08-13
        • 2013-07-16
        • 1970-01-01
        • 2019-04-17
        • 1970-01-01
        相关资源
        最近更新 更多