Question

this问题似乎有些重复，但它无效。

存在两个扩展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;
     ...//   
}

但它只适用于＆＃39; .libraries-search-box＆＃39;。我如何才能让两者都有效？

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。

Answer 2

正确的格式是：

.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类选择器定义了CSS属性。

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

2 个答案: