如何让 Vaadin 标签的标题 font-size 变小？

Question

我知道如何在 Vaadin 中添加样式，并且我已经在我的 css 中完成了多种样式并成功地在代码中添加了样式，但是这个让我望而却步。

我尝试了以下方法：

在css我有以下风格：

  .v-caption-mystyle .v-captiontext {
    font-size: 13px !important;
    font-weight: bold;
    color: $dark-grey;
  }

在代码中，我尝试通过以下两种方式进行设置，但没有任何反应：

postalCodeLabel= new Label(currentAddress.getPostalCode());
postalCodeLabel.setCaption("Postal code"));
postalCodeLabel.addStyleName("v-caption-mystyle");

postOfficeLabel = new Label(currentAddress.getPostOffice());
postOfficeLabel.addStyleName("v-caption-mystyle");
postOfficeLabel.setCaption("Post office"));

编辑： Vikrant Thakur 的回答有效。就我而言，这也有效：

  .v-caption-invoiceaddress-label-caption .v-captiontext {
    font-size: 13px !important;
    font-weight: bold;
    color: $dark-grey;
  }

并且在 Java:

postalCodeLabel = new Label(currentAddress.getPostalCode());
postalCodeLabel.setCaption("myCaption"));
postalCodeLabel.addStyleName("invoiceaddress-label-caption");

Answer 1

我假设 PLabel 是标签 class 的拼写错误或自定义实现。如果是这样，那只是即使您在 Label class 上设置了标题，它也是 CSS class 是 v-label。所以你的 CSS 应该是这样的。

.v-caption-mystyle {
    font-size: 13px !important;
    font-weight: bold;
    color: $dark-grey;
  }

Answer 2

这是主题 scss 文件的代码：

@import "../valo/valo.scss";

@mixin mytheme {

    // Insert your own theme rules here
    .v-caption-mystyle {
        .v-captiontext {
            font-size: 13px;
            font-weight: bold;
            color: red;
        }
    }

    @include valo;
}

而且，这是 Java 代码：

Label label = new Label("This is the label text");
label.setCaption("This is the label caption");
label.addStyleName("mystyle");

如何让 Vaadin 标签的标题 font-size 变小？

How to make the font-size of the caption of a Vaadin Label smaller?

java

css

font-size

vaadin7

caption