Zabarwienie
Przekazuj znaczenie kolorem dzięki kilku klasom użyteczności kolorów. Obejmuje również obsługę stylów linków ze stanami najechania.
Radzenie sobie ze specyfiką
Czasami klas kontekstowych nie można zastosować ze względu na specyfikę innego selektora. W niektórych przypadkach wystarczającym obejściem jest zawinięcie zawartości elementu w <div>
klasę.
Nadawanie znaczenia technologiom wspomagającym
Użycie koloru w celu dodania znaczenia zapewnia jedynie wizualne wskazanie, które nie zostanie przekazane użytkownikom technologii wspomagających – takich jak czytniki ekranu. Upewnij się, że informacje oznaczone kolorem są oczywiste z samej treści (np. widoczny tekst) lub są zawarte w inny sposób, np. dodatkowy tekst ukryty z .sr-only
klasą.
Kolor
.text-primary
.tekst-dodatkowy
.tekst-sukces
.text-niebezpieczeństwo
.ostrzeżenie tekstowe
.informacje-tekstowe
.tekst-światło
.tekst-ciemny
.tekst-treść
.wyciszony tekst
.tekst-biały
.tekst-czarny-50
.tekst-biały-50
Kontekstowe klasy tekstowe działają również dobrze w przypadku kotwic z podanymi stanami najechania i fokusu. Zauważ, że klasa .text-white
i .text-muted
nie ma dodatkowego stylu linków poza podkreśleniem.
Kolor tła
Podobnie jak w przypadku kontekstowych klas kolorów tekstu, łatwo ustaw tło elementu na dowolną klasę kontekstową. Komponenty zakotwiczenia przyciemniają się po najechaniu myszą, podobnie jak klasy tekstowe. Narzędzia działające w tle nie są ustawionecolor
, więc w niektórych przypadkach będziesz chciał użyć .text-*
narzędzi.
Gradient tła
Gdy $enable-gradients
jest ustawiona na true
(domyślnie false
), możesz używać .bg-gradient-
klas użytkowych. Dowiedz się o naszych opcjach Sass , aby włączyć te zajęcia i nie tylko.
.bg-gradient-primary
.bg-gradient-secondary
.bg-gradient-success
.bg-gradient-danger
.bg-gradient-warning
.bg-gradient-info
.bg-gradient-light
.bg-gradient-dark