具有不同名称的JavaFX 2类具有相同的css代码

Question

这个问题可能看似重复,但它无法正常工作.

存在两个扩展HBox并具有一个TextField元素的类.我在每个StyleClass类上添加了如下:

//for one class
 getStyleClass().add("search-box");

 //for the other class
 getStyleClass().add("libraries-search-box");

所以我TextField用上面的css代码修改了他们的外观:

.search-box .text-field {
    -fx-background-color: white;    
    -fx-background-insets:3.0;
    -fx-background-radius: 5.0;   
     ..... 
}

.libraries-search-box .text-field {
    -fx-background-color: white;    
    -fx-background-insets:3.0;
    -fx-background-radius: 5.0;   
     ....
}

我想替换重复的代码,我尝试:

.search-box , .libraries-search-box .text-field {
     -fx-background-color: white;   
    -fx-background-insets:3.0;
    -fx-background-radius: 5.0;
     ...//   
}

但它只适用于' .libraries-search-box'.我如何才能让两者兼顾？

Answer 1

你需要指定.text-field既.search-box和.text-field,作为下一个:

.search-box .text-field, .libraries-search-box .text-field {
     -fx-background-color: white;   
    -fx-background-insets:3.0;
    -fx-background-radius: 5.0;
     ...//   
}

事实上,.search-box , .libraries-search-box .text-field被视为.search-box或.libraries-search-box .text-field不作为.search-box .text-field或.libraries-search-box .text-field作为你的期望.