Jafa FX CSS Duplicates

Question

저는 JavaFX 및 CSS 스타일을 처음 사용하며 다음 작업을 수행하는 최적의 방법에 대해 설명했습니다.

필자는 호버와 포커스를 구현 한 두 개의 버튼이있어서 호버 (마우스)와 집중 (키 보드 탭)에서 테두리 색상이 변경됩니다. 현재 나는 다음과 같습니다

.normalbutton:hover { 

    -fx-font-size: 11pt; 
    -fx-font-family: "Verdana"; 
    -fx-font-weight : Normal; 

    -fx-background-color : #545454; 

    -fx-border-color: #FFFFFF ; 
    -fx-border-radius: 3,3,3,3; 
    -fx-border-width: 1px ; 

} 

.normalbutton:focused { 

    -fx-font-size: 11pt; 
    -fx-font-family: "Verdana"; 
    -fx-font-weight : Normal; 

    -fx-background-color : #545454; 

    -fx-border-color: #FFFFFF ; 
    -fx-border-radius: 3,3,3,3; 
    -fx-border-width: 1px ; 

} 

그것은 잘 작동하지만, 모두 집중을 결합하고이 같은 특성을 가지고 가져가 할 수있는 방법이 있다면 궁금 완.

Answer 1

CSS에서 복수 선택자를 ,으로 구분할 수 있습니다. 둘 중 하나가 일치하면 해당 스타일이 적용됩니다. 당신의 예에서 그 결과는 다음과 같습니다

.normalbutton:hover, 
.normalbutton:focused { 

    -fx-font-size: 11pt; 
    -fx-font-family: "Verdana"; 
    -fx-font-weight : Normal; 

    -fx-background-color : #545454; 

    -fx-border-color: #FFFFFF ; 
    -fx-border-radius: 3,3,3,3; 
    -fx-border-width: 1px ; 

} 

https://www.w3.org/TR/CSS21/selector.html#grouping