我正在尝试使用spring来创建页面。我被困在后面的地面图像出现了。请帮忙。
我的项目结构:
试用
| _WebContent
| _resources
| _theme
| _Web-INF
| _view
| _dispatcher-servlet.xml
| _web.xml
我的web.xml:
<servlet>
<servlet-name>dispatcher</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>dispatcher</servlet-name>
<url-pattern>/</url-pattern>
</servlet-mapping>
我的dispatcher-servlet.xml:
<mvc:annotation-driven />
<bean
class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix">
<value>/WEB-INF/view/</value>
</property>
<property name="suffix">
<value>.jsp</value>
</property>
</bean>
<mvc:resources mapping="/resources/**" location="/resources/theme/"
cache-period="31556926"/>
我所有的jsp文件都在WEB-INF中的视图目录中。 样式表和其他静态资源都有资源。
我的index.jsp :(摘录)
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
<link rel="shortcut icon" href="<c:url value="/resources/images/logo-128x128.png" />" type="image/x-icon">
<meta name="description" content="">
<title>Home</title>
<link href="<c:url value="/resources/tether/tether.min.css" />" rel="stylesheet">
<link href="<c:url value="/resources/bootstrap/css/bootstrap.min.css" />" rel="stylesheet">
<link href="<c:url value="/resources/bootstrap/css/bootstrap-grid.min.css" />" rel="stylesheet">
<link href="<c:url value="/resources/bootstrap/css/bootstrap-reboot.min.css" />" rel="stylesheet">
<link href="<c:url value="/resources/socicon/css/styles.css" />" rel="stylesheet">
<link href="<c:url value="/resources/theme/css/style.css" />" rel="stylesheet">
</head>
<body>
<section class="header3 cid-qLfyYtuPvq mbr-fullscreen mbr-parallax-background" id="header3-j">
<div class="container">
<div class="media-container-row">
<div class="mbr-figure" style="width: 100%;">
<img src="<c:url value="/resources/images/custom-2-1620x1080.jpg"/>" alt="Test" title=""/>
</div>
<div class="media-content">
<h1 class="mbr-section-title mbr-white pb-3 mbr-fonts-style display-1">
Test</h1>
<div class="mbr-section-text mbr-white pb-3 ">
<p class="mbr-text mbr-fonts-style display-7">
Test. Test.</p>
</div>
<div class="mbr-section-btn"><a class="btn btn-md btn-primary display-4">OK</a>
<a class="btn btn-md btn-white-outline display-4" href="page1.html">DO</a></div>
</div>
</div>
</div>
</section>
在我的CSS中我有:
.cid-qLfyYtuPvq {
background-image: url("<c:url value="/resources/images/custom-1-1620x1080.jpg"/>");
}
该页面能够在img标签中查找并加载样式表,custom-2图像。但无法加载外部样式表中指定的图像作为背景图像(custom-1)。请建议。