2014-09-13 2 views
1

내 레이아웃에는 3 pages.xhtml : Top, Body 및 Footer가 있습니다. 이 페이지는 template.xhtml의 <p:playout/>에 있습니다. Body.xhtml 페이지에 배경 이미지를 추가하려고하지만 이미지가 일부 영역에 표시되지 않습니다.배경 이미지를 추가 하시겠습니까?

페이지의 모든 영역에서 이미지를 표시하려면 어떻게해야합니까? 내가 노력하고있어 방법은 다음과

template.xhtml

<p:layout fullPage="true"> 
      <p:layoutUnit position="north"> 
       <ui:include src="/template/top.xhtml"/>     
      </p:layoutUnit> 

      <p:layoutUnit position="center"> 
       <ui:include src="/template/body.xhtml"/>     
      </p:layoutUnit> 

      <p:layoutUnit position="south"> 
       <ui:include src="/template/footer.xhtml"/> 
      </p:layoutUnit> 
     </p:layout> 

body.xhtml

<html xmlns="http://www.w3.org/1999/xhtml" 
     xmlns:ui="http://java.sun.com/jsf/facelets" 
     xmlns:f="http://java.sun.com/jsf/core" 
     xmlns:h="http://java.sun.com/jsf/html" 
     xmlns:p="http://primefaces.org/ui"> 
    <h:head> 
     <title>Facelet Title</title> 

     <style> 
      body{ 
       background-image: url("#{resource['imagens/background.png']}"); 
       width:100%; 
       height:100%; 
       background-repeat: no-repeat; 
       background-attachment:fixed;    
      } 
     </style> 

    </h:head> 
    <h:body> 

    eu sou o body (I'm body) 

    </h:body> 
</html> 

그 결과

enter image description here

답변

3

body { background-image: url("#{resource['imagens/background.png']}"); background-size: cover; background-repeat: no-repeat; background-attachment:fixed;
}

+0

좋은입니다. 그러나 내가 게시 한 이미지처럼 이미지가 열려 있습니다. – FernandoPaiva

1

그냥이주는 시도 :

<style> 
     body{ 
      background-image: url("#{resource['imagens/background.png']}");    
     } 
    </style> 
관련 문제