PrimeFaces : CSS 클래스를 재정의하는 방법

버튼을 만들면 ui-corner-all 클래스가 항상 적용됩니다. 나는 다음을 시도했다 :PrimeFaces : CSS 클래스를 재정의하는 방법

<p:commandButton id="like" styleClass="ui-corner-right" />

그러나 작동하지 않았다.

<div id="form1:like" type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left ui-corner-right">

UPDATE : 1 : 방화범, 나는 모두 ui-corner-all 및 ui-corner-right 보았다 JMelnik에서 힌트에 따라

을, 나는 마지막으로 다음 스크립트를 추가하여 ui-corner-right에 ui-corner-all의 스타일을 변경 성공 :

<style type="text/css"> 
    #myForm\:likeButton .ui-corner-all { 
     border-radius: 6px 0px 0px 6px !important; 
    } 
</style>

<p:commandButton>을 <h:panelGroup> 다음과 같이 포장하십시오.

<h:form id="myForm"> 
    <h:panelGroup id="likeButton"> 
     <p:commandButton /> 
    <h:panelGroup> 
</h:form>

업데이트 2 : BalusC의 제안에

덕분에 다음과 같은 솔루션이 더 있어야한다 :

<style type="text/css"> 
    .likeButton .ui-corner-all { 
     border-radius: 6px 0px 0px 6px !important; 
    } 
</style> 

<h:panelGroup styleClass="likeButton"> 
    <p:commandButton /> 
<h:panelGroup>

안부,

출처

2012-06-21 Mr.J4mes

예를 들어 ''에 CSS 파일을로드하고 'ui-button ui-widget ui-state-default ui-corner-all UI'로 정의 된 필수 속성을 무시하도록하십시오. -button-text-icon-left'당신의 경우에는 INMO를 사용하십시오. js에서 css를 조작하지 마십시오. – Daniel

MSIE에서'\ :'이 작동하지 않습니다. 이러한 버튼은보기에 완전히 고유하지 않을 수 있습니다. 오히려 클래스 이름을 사용하십시오. – BalusC

관련 항목 : http://stackoverflow.com/questions/8768317/how-do-i-re-write-those-class-defined-in-primefaces-css 및 http://stackoverflow.com/questions/5878692/how -to-use-jsf-generated-html-element-id-in-css-selectors – BalusC

사용 표준 CSS 재정의 방법입니다.

ui-corner-all 및 ui-corner-right 클래스를 다시 정의하는 페이지에 * .css를 포함하십시오.

원하지 않는 속성을 무시할 수있는 추가 css 클래스를 적용 할 수도 있습니다.

출처

2012-06-21 08:57:34 JMelnik

흠 ...'ui-corner-all'의 속성을'ui-corner-right '? 생성 된 HTML에서 'ui-corner-all'을 삭제할 수있는 방법이 있습니까? –

javascript/jquery를 사용하여 항목이있는 항목에 대해 "removeClass ('ui-corner-all')"을 사용할 수 있습니다. 다소 지저분하지만 자바 스크립트가 활성화 된 사용자에 따라 다릅니다. Firebug를 사용하여 "ui-corner-all"이 적용되는 CSS 스타일을 가져 와서 자신의 CSS에서 모두 덮어 쓸 수도 있습니다. 다만 JMelnik이 여기에서 말한 것을 되풀이합니다. – ConorLuddy

@ Cluddy thanks 지금 해봐야겠다. :) –

PrimeFaces : CSS 클래스를 재정의하는 방법

답변

관련 문제