JavaFX 中的行高类似物 CSS

Question

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

.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，并将 min/max 大小设置为 USER_PREF_SIZE。

使用 modena.css 的按钮的默认插图（包括填充）是这些：

-fx-padding: 6 12 6 12;

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

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

.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;
}

得到这样的东西：

JavaFX 中的行高类似物 CSS

Analogs of line height in JavaFX CSS

css

java

javafx

button