primeface를 덮어 쓰는 방법 panelgrid footer css

나는 대부분의 시간 동안 primeface panelgrid 바닥 글을 덮어 쓰려고 노력했지만 어떻게 작동하는지 찾을 수 없습니다. 바닥 글 배경색을 변경하고 싶습니다.primeface를 덮어 쓰는 방법 panelgrid footer css

내 CSS :

.ui-panelgrid .ui-panelgrid-footer { 
    text-align: right; 
    padding: 2px 5px; 
    background-color: yellow; 
}

내 구성 페이지 :

<ui:composition 
template="/templates/templateMain.xhtml" 
xmlns="http://www.w3.org/1999/xhtml" 
xmlns:h="http://java.sun.com/jsf/html" 
xmlns:f="http://java.sun.com/jsf/core" 
xmlns:ui="http://java.sun.com/jsf/facelets" 
xmlns:p="http://primefaces.org/ui" 
xmlns:c="http://java.sun.com/jsp/jstl/core"> 
<ui:define name="navigatorWest"> 
    <ui:include src="pages/navigationMenu.xhtml"/> 
</ui:define> 
<ui:define name="bodyContent"> 

<h:form>  
<p:panelGrid columns="2" style="width:100%"> 
    <f:facet name="header"></f:facet> 
     <h:outputLabel value="" /> 
     <h:outputText id="currentWay" value="" /> 

     <h:outputLabel for="way" value="" /> 
     <p:selectOneMenu id="way" value="" style="width:200px"> 
      <f:selectItems value="" /> 
     </p:selectOneMenu> 

     <p:outputLabel for="time" value=" /> 
     <p:inputText id="time" value="" size="20" validator="#">  </p:inputText> 

    <f:facet name="footer"><p:commandButton value="Save" id="save"  actionListener="" ajax="false" /></f:facet>   
</p:panelGrid> 
</h:form> 
</ui:define> 
</ui:composition>

내 템플릿 페이지 :이 마지막으로로드 할 수 있도록 나는 몸에 스타일 시트를 배치 한

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:p="http://primefaces.org/ui" 
    > 
<h:head> 
</h:head> 
<h:body> 
<h:outputStylesheet library="stylesheets" name="css/styles.css" /> 
    <p:layout fullpage="true" > 
     <p:layoutUnit position="west" resizable="true" size="245"> 
      <ui:include src="/pages/navigationMenu.xhtml"/> 
     </p:layoutUnit> 
     <p:layoutUnit id="center" position="center" resizable="true"> 
      <ui:insert name="bodyContent">default info</ui:insert> 
     </p:layoutUnit> 
    </p:layout>  
</h:body> 
</html>

및 크롬에서 특정 요소를 검사하는 선택기를 찾았지만 여전히 배경색을 지정하지 않고 기본 색조를 유지합니다. 아르 자형. 요소를 검사하는 동안 색을 볼 수도 있지만 색이 바래다. 나는 내가 뭘 잘못하고 있는지 이해하지 못한다. 보시다시피 배경색 노란색이지만 작동하지 않습니다. 나는 그 정렬이 왼쪽에서 오른쪽으로 움직일 수 있고 버튼 이동이 가능하다는 것을 추가해야한다. 그래서 나는 CSS에서 바로 뭔가가 있다고 생각한다.

검사 요소 :

출처

2016-06-08 Spike

이 답변을 살펴 보시겠습니까? http://stackoverflow.com/questions/8768317/how-do-i-override-default-primefaces-css-with-custom-styles/ –

네, 그걸 보았습니다. 그래서 제가 몸에 스타일 시트가있어서 그걸로드합니다. 마지막으로 나는 검사 대상이되는 크롬 셀렉터를 찾아 보았으나 특정 일을 목표로 삼았지만 아직도 아무것도하지 않았다. 나는 누군가가 어쩌면 내가 뭘 잘못했는지 알기를 원했다. 어쩌면 그게 구체적이지 않은지 알 수 없다. 왜 여기 있는지 모르겠다. – Spike

난 내 자신의 문제를 해결하기 위해 관리. 그늘진 아지즈 (Shady Aziz)가 시작하자마자 나는 그의 링크를보고 있었고, 내가 바꾸고 싶었던이 특정 요소를 검사하여 스타일에서 셀렉터를 복사하려고 시도했지만 작동하지 않았다. 그런 다음 마침내 나는 요소 자체를보고 복사하려고했습니다. 내가 말하는 요소는 class = "ui-panelgrid-footer"입니다. 일

CSS는 : 당신이 볼 수 있듯이

.ui-panelgrid-footer .ui-widget-header { 
text-align: right; 
padding: 2px 5px; 
background-color: white;}

은 내가 변경을 원 요소를 만들어 그 일이, 바닥 글 클래스 대신 스타일의 그 아래에 있었다 클래스를했다.

다른 사람에게도 도움이되기를 바랍니다.

출처

2016-06-08 19:24:47 Spike

_ 나는 이해하지 못한다. 그것은 스타일 대신에 "_ 정교 할 수 있니? – Kukeltje

크롬에서 요소를 검사 할 때 요소, 스타일 등 여러 개의 창을 제공했습니다. 시작시 스타일 윈도우를 보면서 선택기를 얻으려고했으나 나중에 요소 윈도우를 살펴 봐야한다는 것을 깨달았습니다. – Spike

primeface를 덮어 쓰는 방법 panelgrid footer css

답변

관련 문제