Java 如何在Spring MVC项目的“jsp”中使用“css”？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22313551/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to use "css" in the "jsp" in Spring MVC project?
提问by
I am working on a spring MVC project in which I am trying to use cssstyle sheets by referencing it to design my JSP page. But somehow my css files are not being picked up once I hit my method in the controller..
我正在开发一个 spring MVC 项目，在该项目中我试图css通过引用样式表来设计我的 JSP 页面来使用它。但是不知何故，一旦我在控制器中点击了我的方法，我的 css 文件就不会被拾取。
Below is my JSP file -
下面是我的 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>
And below is my test.cssfile -
下面是我的test.css文件 -
h1 {color:red;}
h2 {color:blue;}
p {color:green;}
And below is my method in controller class -
下面是我在控制器类中的方法 -
@RequestMapping(value = "testing", method = RequestMethod.GET)
public Map<String, String> testing() {
final Map<String, String> model = new LinkedHashMap<String, String>();
return model;
}
Directory structure is like this -
目录结构是这样的——
webapp/
|-- resources/
| +-- css/
| test.css
+- WEB-INF/
+-- views/
testing.jsp
But somehow it's not working for me.. Is there anything wrong I am doing here?
但不知何故它对我不起作用..我在这里做的有什么问题吗？
UPDATE:-
更新：-
Here is my web.xml file-
这是我的 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>
And below is my context.xmlfile -
下面是我的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.RaptorHymansonHttpMessageConverter"/>
</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>
This is exception I am getting on my console but browser shows the data without any css -
这是我在控制台上遇到的异常，但浏览器显示的数据没有任何 css -
404 /testweb/test.css Not Found /testweb/test.css Not Found }, Correlations : {} }
采纳答案by Game Over
this css resource issue
这个css资源问题
please try below
请尝试以下
<link rel="stylesheet" type="text/css" href="css/test.css" />
and you can see this resource if be load by bowaser.
如果由 bowaser 加载，您可以看到此资源。
回答by justadeveloper
In your servlet-context.xml file,you have setting about your directory of resources.In your case,with changing
在您的 servlet-context.xml 文件中，您有关于资源目录的设置。在您的情况下，更改
<resources mapping="/resources/**" location="/resources/"/>
and in your jsp page like below,
在你的jsp页面中，如下所示，
<link rel="stylesheet" type="text/css" href="
<c:url value="/resources/css/test.css"/> "/>
I hope it will work
我希望它会起作用
回答by Chinmay
You need to provide the context path.
您需要提供上下文路径。
<link rel="stylesheet" href="${pageContext.request.contextPath}/resources/css/test.css" />
What does this expression language ${pageContext.request.contextPath} exactly do in JSP EL?
这个表达式语言 ${pageContext.request.contextPath} 在 JSP EL 中到底做了什么？
回答by Chinthaka Dinadasa
You need to set <base/>as following...
您需要设置<base/>如下...
<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}/" />
Then You can Import any JS or CSS like below..
然后你可以像下面这样导入任何 JS 或 CSS。
<script src="assets/js/angular/angular.js"></script>
回答by Magaly Alonzo
Maybe by adding your .css file in a specific folder inside the WEB-Content then, you could use the attribute href = "yourFolder/yourFile.cssIndeed all "web" ressources like the view should be there (i.e. jsp, css.).
You can also precise that your link (in the .jsp file) is a stylesheet one by adding: rel="stylesheet"
也许通过将您的 .css 文件添加到 WEB-Content 内的特定文件夹中，您可以使用属性href = "yourFolder/yourFile.cssIndeed 所有“web”资源，如视图应该在那里（即 jsp、css。）。您还可以通过添加以下内容来确定您的链接（在 .jsp 文件中）是一个样式表：rel="stylesheet"
you will have a link looking like this :
你会有一个看起来像这样的链接：
