2017-01-03 1 views
1

내가하려고하는 것은 패딩이없는 패널 내부의 패널입니다.패널 내부의 패널

enter image description here

나는 개발자 모드 내 패널은 더 이상 패딩이 없습니다

.sapUiPanelCont 
    { 
    padding. 0px !important; 
    } 

에 쓸 때. 그게 내가 원하는거야. 이 클래스를 고유 한 이름으로 재정의하는 방법은 무엇입니까? 그래서 다른 패널은 정상적인 sapUiPanelCont를 얻었고이 클래스를 제 컨트롤에 추가하면 모든 것이 매력처럼 작동합니다. 아래 그림과 같이

내가 내 styleClass를 추가했습니다 :

control.addStyleClass("exampleClass"); 

답변

1

귀하의 CSS 선택기는 기본 .sapUiPanelCont보다 더 구체적이어야한다. The most specific selector 'wins'.

그래서 당신은 선택 .sapUiPanelCont.exampleClass를 사용하려고 생략 중요한 플래그 수 : 당신은 새로운 .css 파일에 스타일을 추가 할 수 있습니다

.sapUiPanelCont.exampleClass 
{ 
    padding: 0px; 
} 

및 구성 요소 메타 데이터/설명에서이를 참조 . Table 4 of documentation을 참조하십시오.

... 
"sap.ui5": { 
    "resources":{ //relative urls inside component 
     "css": [{ 
      "uri": "myStyles.css" 
     }] 
    }, 
... 

구성 요소가로드되면 myStyles.css가 html 문서에 한 번 추가됩니다. 당신이 XMLViews를 사용하는 경우

또는, 당신이 할 수있는 inline the styles into the view :

<mvc:View controllerName="whatever" xmlns="sap.ui.commons" xmlns:mvc="sap.ui.core.mvc" 
      xmlns:html="http://www.w3.org/1999/xhtml"> 
    <html:style> 
    .sapUiPanelCont.exampleClass 
    { 
     padding: 0px; 
    } 
    </html:style> 
    <Panel class="exampleClass" text="Outer Panel"> 
     <Panel text="Inner Panel"> 
     </Panel> 
    </Panel> 
</mvc:View> 
관련 문제