从组件中删除边框

Question

我想创建一个以组合框为前缀组件的搜索字段，以便用户可以指定他想要搜索的实体类型。

为了使它看起来漂亮，我想从组合框中删除边框（也可能从文本字段中删除边框）。

我认为这段代码可以做到这一点，但不幸的是没有。结果如下所示。

ComboBox<InformationType> informationTypes = new ComboBox<>();
informationTypes.setItems(InformationType.values());
informationTypes.addClassName(LumoUtility.Border.NONE);

Answer 1

我对 VAADIN 不太了解，但我怀疑这条线

informationTypes.addClassName(LumoUtility.Border.NONE);

不正确。

您应该使用 CSS 类名来添加到对象，如下所示：

informationTypes.addClassName("borderless");

CSS 应该是这样的：

.borderless {
  border-width: 0;
}

如果您还想删除轮廓（当用户选择搜索框时），您可以将 CSS 更改为：

.borderless {
  border-width: 0;
  outline-width: 0;
}