Цвет не применяется к меню в семантическом пользовательском интерфейсе

Я создаю меню с помощью Semantic UI. Это меню должно иметь цветной фон и текстовые элементы. В целях тестирования я добавил класс green:

<body>
  <div class="ui stackable green text menu">
    <div class="header item">Site Title</div>
    <div class="ui right text menu">
      <a class="item">Item 1</a>
      <a class="item">Item 2</a>
      <a class="item">Item 3</a>
    </div>
  </div>
</body>

Меню и его элементы отображаются, но зеленый цвет не применяется.

Вот демонстрация на codepen.io.


person Robert Strauch    schedule 26.10.2017    source источник


Ответы (1)


Это не очевидно, но вам нужно добавить «инвертированный» класс для применения цвета:

<body>
  <div class="ui stackable green inverted menu">
    <div class="header item">Site Title</div>
    <div class="ui right text menu">
      <a class="item">Item 1</a>
      <a class="item">Item 2</a>
      <a class="item">Item 3</a>
    </div>
  </div>
</body>
person Alexander Tyapkov    schedule 27.10.2017