Как получить пользовательскую кнопку с цветом фона и прямоугольником?

Question

Я работаю с GWT. У меня есть требование, где мне нужно показать кнопку, как показано ниже. Пожалуйста, помогите мне, как этого добиться?

Спасибо!

Answer 1

Вы можете использовать класс GWT Button и стилизовать его так, как вам нужно.Например, если вы используете UiBinder:

<g:Button ui:field="button" styleName="my-button">
    <ui:msg key="myButtonMsg">Button</ui:msg>
</g:Button>

со своим собственным классом css, например

.my-button {
    background: green;
    border: 1px solid green;
    color: white;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding: 5px 15px 5px 15px;
    font-weight: bold;
}

Если вам нужно, чтобы над текстом был белый прямоугольник, добавьте <span>вокруг текста кнопки и добавьте color: black; и background-color: white; свойства для span.