java - 覆盖 gwt 中的默认小部件类名称

Question

Gwt 使用标准化的 css 类名，例如

.gwt-Image 
.gwt-Button 

等等。这使我无法将这些类与流行的 css 框架(例如 bootstrap)一起使用。

有没有一种方法可以覆盖这些默认样式名称并使用 Bootstrap 或符合基础的类名称？

Answer 1

如果您使用 LESS 作为 CSS 预处理器，您可以将 Bootstrap 混合扩展到您的 GWT 类

例如:

.gwt-Button {
    .btn(); //This is the bootstrap mixin for buttons
}

渲染到:

    .gwt-Button{
       display: inline-block;
       margin-bottom: 0;
       font-weight: normal;
       text-align: center;
       vertical-align: middle;
       touch-action: manipulation;
       cursor: pointer;
       background-image: none;
       border: 1px solid transparent;
       white-space: nowrap;
       padding: 6px 12px;
       font-size: 14px;
       line-height: 1.42857143;
       border-radius: 4px;
       -webkit-user-select: none;
       -moz-user-select: none;
       -ms-user-select: none;
       user-select: none;
    }

这有点耗时，但它可以让你在 CSS 中拥有一切