Question

我目前正在为大学开发一个javaFX项目。我们不能使用FXML，因此我们使用了CSS。我正在尝试在菜单栏中添加字体颜色，但我没有运气。我也尝试这样做，以便当你将鼠标悬停在菜单栏选项卡上时，它会将字体更改为蓝色。任何帮助将不胜感激。谢谢！

JavaFX代码：

final Menu homeTab = new Menu("Home");
final Menu aboutTab = new Menu("About Us");
final Menu optionsTab = new Menu("Options");
final Menu contactTab = new Menu("Contact Us");
final Menu faqTab = new Menu("FAQ");

MenuItem infoTab = new MenuItem("About the Team");
MenuItem legalTab = new MenuItem("Legal Information");
MenuItem logoutTab = new MenuItem("Logout");
MenuBar navigation = new MenuBar();

//MenuBar details

    //Details for CSS
    homeTab.setId("Home");
    aboutTab.setId("Home");
    contactTab.setId("Home");
    faqTab.setId("Home");
    optionsTab.setId("Home");

    infoTab.setId("Info");
    legalTab.setId("Legal");
    logoutTab.setId("Logout");

    //Assigning our Sub Tabs to the About/Legal tabs
    aboutTab.getItems().addAll(infoTab, legalTab);
    optionsTab.getItems().add(logoutTab);

    //Adding our tabs to our navigation bar
    navigation.getMenus().addAll(homeTab, aboutTab, contactTab, faqTab, optionsTab);
    navigation.setId("MenuBar");

CSS：

#MenuBar{
    -fx-padding: 1 8 2 8;
    -fx-font-size: 11pt;
    -fx-border-color: #58A4B0; 
    -fx-spacing: 70;  
    -fx-background-color: #58A4B0;
}

#Home{
    -fx-border-style: solid;   
    -fx-border-color: #FFFFFF; 
    -fx-border-radius: 8px;
}

#Home#Label{  
    -fx-text-fill: white;
}

#Home:hover{
    -fx-background-color: #FFFFFF;
    -fx-background-radius: 8px;
    -fx-border-style: solid;
    -fx-border-radius: 8px;
}

Answer 1

如果不进行测试，我认为您的CSS选择器不正确。

您正在设置节点的ID，但是按类调用它们。

尝试用＃。

替换点

.Home：hover - ＆gt; #Home：悬停

＃选择id，即。类，而不仅仅是类型。

但要小心，id必须是唯一的。

编辑：因为您不止一次使用id，所以您应该分配insted类。所以保持重点，但取代homeTab.setId（“Home”）; with homeTab.getStyleClass（）。add（“Home”）;

基本上我正试图通过CSS为JavaFX中的菜单栏添加颜色

1 个答案: