JavaFX - 使用CSS为Textfield设置焦点边框

Question

我希望在三种情况下有三个不同边框的文本字段：

• 未悬停或聚焦时的白色边框
• 悬停时的灰色边框
• 聚焦和打字时的蓝色边框

我是这样开始的：

#custom-text-field  {
    -fx-border-width: 2;
    -fx-border-color: white;
}

#custom-text-field:hover{
    -fx-border-width: 2;
    -fx-border-color: #909090;
}

#custom-text-field:focused{
    -fx-border-width: 2;
    -fx-border-color: #0093EF;
}

问题在于聚焦的边界永远不会出现。如何正确设置？

Answer 1

我像这样使用它

.custom-text-field {
    -fx-background-color:
        #FFFFFF,
        #FFFFFF;
    -fx-background-insets: 0, 2;
    -fx-background-radius: 0, 0;
 }

.custom-text-field:focused {
    -fx-background-color:
        #0093EF,
        #FFFFFF;
}

.custom-text-field:hover {
    -fx-background-color:
        #909090,
        #FFFFFF;
}

.custom-text-field:focused:hover {
    -fx-background-color:
        #0093EF,
        #FFFFFF;
}