Jak utworzyć: etykieta

Naucz się, jak używać CSS do ustawiania stylu etykiet.

Sukces Informacja Ostrzeżenie Niebezpieczny Inne

Spróbuj sam

Jak ustawić styl etykiet

Krok 1 - Dodaj HTML:

<span class="label success">Sukces</span>
<span class="label info">Informacja</span>
<span class="label warning">Ostrzeżenie</span>
<span class="label danger">Niebezpieczny</span>
<span class="label other">Inne</span>

Krok 2 - Dodaj CSS:

.label {
  color: white;
  padding: 8px;
}
.success {background-color: #04AA6D;} /* zielony */
.info {background-color: #2196F3;} /* niebieski */
.warning {background-color: #ff9800;} /* pomarańczowy */
.danger {background-color: #f44336;} /* czerwony */
.other {background-color: #e7e7e7; color: black;} /* szary */

Spróbuj sam