组合框css代码

时间:2015-04-13 15:52:13

标签: java css eclipse javafx

我正在用javafx做一个大学项目,但我的css知识很差,我需要一些东西。我有一些代码可以制作灰色组合框的边框,当你聚焦它时,边框变为蓝色,但是当你点击它时,边框会变为白色,我希望边框保持蓝色。我应该在代码中添加什么内容?

.combo-box-base {
    -fx-background-color: transparent, lightgrey, transparent, white;
    -fx-background-radius: 0, 0, 0, 0;
    -fx-padding: 0.166667em; /* 2 */
}

.combo-box-base:hover  {
    -fx-background-color: transparent,  #6699FF, transparent, white;

}

.combo-box-base:disabled {
    -fx-opacity: .4;
}

.combo-box-base .arrow-button {
    -fx-background-color: transparent, lightgrey, transparent, white;
}

.combo-box-base .arrow {
    -fx-padding: 0.333333em 0.333333em 0.333333em 0.333333em; /* 4 4 4 4 */
    -fx-shape: "M8.124,13.625l4.125-3.375v2.889l-4.125,3.86L4,13.139V10.25L8.124,13.625z";
}

.combo-box-popup .list-view {
    -fx-background-color: lightblue, -fx-control-inner-background;
    -fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0) , 8, 0.0 , 0 , 0 );
}

.combo-box-popup .list-view .list-cell:hover{
    -fx-background: -fx-accent;
    -fx-background-color: lightblue;
    -fx-text-fill: black;
}

.combo-box-popup .list-view .list-cell:filled:selected{
    -fx-background-color: #55c4fe;
}

.combo-box-popup .list-view .list-cell:filled:selected:hover {
    -fx-background-color: #6dcdff;
}

.combo-box-popup .list-view .list-cell:filled:pressed, .combo-box-popup .list-view .list-cell:filled:selected:pressed
{
    -fx-background-color: #d3d3d3;
    -fx-text-fill: #1d1d1d;
}

悬停时的ComboBox

enter image description here

选择时的组合框

enter image description here

2 个答案:

答案 0 :(得分:0)

只需更改此

.combo-box-base:hover  {
    -fx-background-color: transparent, #6699FF, transparent, transparent, white;
}

输出:

enter image description here

答案 1 :(得分:0)

你应该添加“白色”而不是颜色,只需改变它:

.combo-box-base .arrow-button {
-fx-background-color: transparent, white, transparent, white;}




.combo-box-base {
-fx-background-color: transparent, white, transparent, white;
-fx-background-radius: 0, 0, 0, 0;
-fx-padding: 0.166667em; /* 2 */}