Vaadin은 순수 HTML 요소 (예 : 본문, h1 등의 요소의 스타일 및 레이아웃) 용으로 작성된 CSS를 Vaadin에서 어떻게 사용하고 Vaadin에서 정확한 CSS 스타일을 사용합니까?CSS를 사용하여 양식 구성 요소의 스타일을 지정하는 방법은 무엇입니까?
해당 Vaadin 요소에 매핑하기 위해 CSS를 변경해야합니까? 아니면 해당 CSS를 그대로 사용할 수 있습니까?
Vaadin은 데모를 보면 알 수 있듯이 HTML 만 생성하므로 예.
당신은 그대로는 CSS를 사용할 수 있지만 (자연스럽게) CSS 클래스가 둘 사이의 차이
myComponent.setStyleName("myStyleClass");
또는
myComponent.addStyleName("myStyleClass");
를 호출하여 사용할 수 angel이라는 얘기해야합니다 setStyleName은 기존 스타일을 제공된 스타일로 바꿉니다. addStyleName은 아무 것도 대체하지 않고 제공된 스타일을 구성 요소에 추가합니다.
는 또한 노란색마다 패널의 배경 색상을 변경할 것입니다 예를
.v-panel .v-panel-content {
background: yellow;
}
를 들어, 기본 angel이라는 스타일을 재정의 할 수 귀하의 CSS를 수정할 수 있습니다.
기존 Vaadin 테마를 기반으로 새 테마를 만드는 것이 좋습니다. 여기 방법입니다 : (. 예를 들어, 만약 angel/테마/myTheme)
@import "../runo/styles.css";을 추가하십시오 (다른 기존 테마로 runo를 대체 할 수 있음).setTheme(myTheme);으로 전화하십시오.setStyleName 또는 addStyleName 메서드를 호출하십시오.Vaadin의 here에있는 CSS 항목을 참조하십시오.
해당 Vaadin 요소에 매핑하기 위해 CSS를 변경해야합니까, 아니면 해당 CSS를 그대로 사용할 수 있습니까?
고유 한 CSS 스타일을 그대로 사용할 수 있으며 개별 구성 요소 (앞에서 "miq *"라고 말한 것) 또는 전체 페이지에 사용할 수 있습니다.
https://vaadin.com/book/-/page/themes.css.html