2017-01-25 14 views
0

私はUIデザインをアプリケーションに統合するのが新しいです。 I JSPページを持っているとwhickコードは以下のとおりである:私は、このJSPファイルの実行時に背景イメージとロゴイメージはjspページに表示されません。

以下

`

<!DOCTYPE html> 
<%@page import="java.util.Enumeration"%> 
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> 
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%> 
<%@ taglib prefix="s" uri="http://www.springframework.org/tags" %> 

<html lang="en"> 
<head> 
<jsp:directive.include file="include_metatags.jsp" /> 
<title><s:message code="form.home.testEvosnapResponse" arguments="${applicationScope['APPLICATION_HEADER_TEXT']}"/></title> 
<jsp:directive.include file="include_head.jsp" /> 

<link href="${pageContext.request.contextPath}/resources/css/datatables.min.css" rel="stylesheet"> 
<style> 
     body,html{ 
        background-image  : url("resources/img/xyymm/home.jpg"); 
        background-attachment : fixed; 
        background-position : center center; 
        background-size  : cover; 
       } 
    </style> 
</head> 
<body> 

    <jsp:include page="menu.jsp"> 
     <jsp:param value="xylyx" name="currentpage" /> 
    </jsp:include> 

    <div class="container amo2"> 
     <div class="card card-container2" 
      style="padding: 20px 40px 90px 40px;"> 
      <img id="profile-img" class="profile-img-card" src="resources/img/xyymm/fintech_img.png"> 

      <h4 style="margin-bottom: 20px;">Evosnap Response Page</h4> 

      <div class="container-fluid mer table-responsive" id="wht"> 

       <ol class="breadcrumb"> 
        <li><a href="${pageContext.request.contextPath}/home">Home</a></li> 
        <li><a href="${pageContext.request.contextPath}/evosnapTest">Evosnap Test</a></li> 
        <li>Evosnap Response Page</li> 
       </ol> 

       <div class="body-content" style="padding-left: 15px;"> 

        <p>${message}</p> 
        Transaction Details 
        <table style="width: 60%"> 
         <tr> 
          <td><s:message code="form.transactionlist.transactionId" /></td> 
          <td>${transaction.transactionId}</td> 
         </tr> 
         <tr> 
          <td><s:message code="form.transactionlist.merchantId" /></td> 
          <td>${transaction.merchantId}</td> 
         </tr> 
         <tr> 
          <td><s:message code="form.transactionlist.customerId" /></td> 
          <td>${transaction.customerId}</td> 
         </tr> 
         <tr> 
          <td><s:message code="form.transactionlist.name" /></td> 
          <td>${transaction.lastName},${transaction.firstName}</td> 
         </tr> 
         <tr> 
          <td><s:message code="form.transactionlist.invoiceNumber" /></td> 
          <td>${transaction.invoiceNum}</td> 
         </tr> 
         <tr> 
          <td><s:message code="form.transactionlist.amount" /></td> 
          <td>${transaction.amount}</td> 
         </tr> 
         <tr> 
          <td><s:message code="form.transactionlist.ipAddress" /></td> 
          <td>${transaction.ipAddress}</td> 
         </tr> 
         <tr> 
          <td><s:message code="form.transactionlist.currency" /></td> 
          <td>${transaction.currency}</td> 
         </tr> 
         <tr> 
          <td><s:message code="form.transactionlist.orderStatus" /></td> 
          <td>${transaction.orderStatus}</td> 
         </tr> 
        </table> 

       </div> 

      </div> 
      <!-- /card-container --> 
     </div> 
    </div> 

    <jsp:directive.include file="include_body_scripts.jsp" /> 
</body> 
</html> 

`

は私のスクリーンショットです: enter image description here

を私は背景画像が欲しいですここで私はインラインCSSとして追加しましたが、背景イメージは正しく表示されず、ロゴも表示されません。

誰でも私にこれを手伝ってもらえますか?前もって感謝します。

+0

多分パスが間違っている、URLパスを変更してみてください。 url( "../ resources/img/xyymm/home.jpg");またはurl( "./ resources/img/xyymm/home.jpg")。あなたの道に応じて。 – Alice

+0

あなたの時間をありがとうが、私はこの解決策を試みたが、それは私を助けていない。 –

答えて

1

あなたのページは /FTL/evosnapRedirectController/success/1485323783355です。インラインCSSで 相対URL resources/img/xyymm/home.jpg/FTL/evosnapRedirectController/success/resources/img/xyymm/home.jpgに解決、資源があなたがバックグラウンドURLにコンテキストパスを含める必要があり/FTL/resources/img/xyymm/home.jpg

で実際にあるようです:

background-image  : url("<c:url value='/resources/img/xyymm/home.jpg'/>"); 

または

background-image  : url("${pageContext.request.contextPath}/resources/img/xyymm/home.jpg"); 
関連する問題