java - JavaFX CSS 中行高的类比

Question

将按钮的字体大小增加到 18 px 后，按钮上的标签略微向下移动，现在部分文本不可见。我试过使用 -fx-content-display: top;和-fx-translate-y:-5px；但它没有帮助。组合框也是如此。有没有比单独创建按钮和标签更好的定位文本/更改行高的方法？还有什么方法可以添加字母间距？按钮代码:

.button{
-fx-background-image: url("images/reg_button.png");
-fx-background-repeat: no-repeat;
-fx-font-family: "Segoe UI Semilight";
-fx-font-size:18;
-fx-alignment:center;
-fx-text-fill: white;
-fx-background-insets: 0, 0, 1, 2;
-fx-translate-y: -5px;
-fx-content-display: top;}

Answer 1

假设您正在使用 Scene Builder 并将按钮的首选大小设置为 201x31，并将最小/最大大小设置为 USER_PREF_SIZE。

使用 modena.css 的按钮的默认插图(包括填充)是这些:

-fx-padding: 6 12 6 12;

如果按钮的高度固定为 31 像素，这意味着文本高度有 19 像素的空闲空间。标签从顶部呈现 6 个像素，因此它在底部被剪切。

因此您需要根据自己的方便修改它以获得更多空间，例如:

.button{
    -fx-background-image: url("image/reg_button.png");
    -fx-background-repeat: no-repeat;
    -fx-font-family: "Segoe UI Semilight";
    -fx-font-size:18;
    -fx-alignment:center;
    -fx-text-fill: white;
    -fx-content-display: top;
    -fx-padding: 0 0 3 0;
}

得到这样的东西: