如何改变vaadin的体型

Question

如何在vaadin更改正文标记样式？我使用的是.v-sa，但它不起作用，.v-generated-body也没有。

Answer 1

我只是假设您想要更改背景颜色。如果没有，请指定您尝试设置样式的body元素的属性。

很可能主题定义了.v-app元素的背景颜色，它位于body元素的顶部（并且100％高），因此您永远不会看到为body定义的背景

因此，您需要将.v-app背景设置为透明，并将首选背景设置为body，或者直接将首选背景设置为.v-app。

Answer 2

弹出窗口显示为正文下的兄弟v-app元素（添加了v-overlay-container）。因此，如果要在运行时添加适用于主ui的类名以及所有弹出窗口，则需要直接访问body元素。我们有一个特定的用例需要这个。

body v-generated-body
- v-app 
- v-app v-overlay-container
- v-app v-overlay-container

以下是我们使用的代码：

String additionalClassName = "my-selector";
com.vaadin.ui.JavaScript.eval("document.body.class +=  ' " + additionalClassName + "';");

还有其他（更好）方法可以执行Javascript，例如向容器添加扩展，在共享状态下设置类名，以及从客户端更新元素。这种方法可以防止Vaadin运行时在重新同步客户端时消除您的更改。我不认为身体标签会受到这种情况的影响，因此这种评估可能会影响您的生产目的。