bootstrap tutorials kurs
Bootstrap w swoich zbiorach zawiera wiele różnych ciekawych rozwiązań. Jedną z nich są etykiety i odznaki, plakietki czyli Badges and Labels.
Sposobów wykorzystań ich może być wiele. Przykładowo plakietki mogą zostać użyte do opisania ilości dokumentów do pobrania znajdujących się na stronie, do której prowadzi link. Z kolei etykiety jak sama nazwa mówi jako dodatkowy opis przycisku.
Poniżej znajduje się przykładowa lista wraz z odznaką:
<ul class="list-group">
<li class="list-group-item"> <span class="badge">14</span> Cras justo odio </li>
<li class="list-group-item"> <span class="badge">2</span> Dapibus ac facilisis in </li>
<li class="list-group-item"> <span class="badge">1</span> Morbi leo risus </li>
</ul>Jak widać odznaka to mały okrągły obiekt z liczbą umieszczoną w środku. Oczywiści kształt odznaki można zmienić nadpisując jej właściwości w stylach CSS. Tak jednak wygląda ona domyślnie w bibliotece Bootstrap.
Najistotniejszym fragmętem jest
<span class="badge">1</span>To w nim umieszczamy liczbę. Tekstu raczej nie polecam jeśli che się zachować kształt.
Poniżej plakietka na przycisku
<button type="button" class="btn btn-primary">Primary <span class="badge">7</span></button>Etykiety są wykorzystywane do dostarczenia dodatkowych informacji o czymś.
Przykładowe etykiety:
Default Label
Primary Label
Success Label
Info Label
Warning Label
Danger Label
<p><span class="label label-default">Default Label</span><br>
<span class="label label-primary">Primary Label</span><br>
<span class="label label-success">Success Label</span><br>
<span class="label label-info">Info Label</span><br>
<span class="label label-warning">Warning Label</span><br>
<span class="label label-danger">Danger Label</span></p>Jak widać w tym wypadku mamy wybór kilku kolorów etykiet. Oczywiście na ich bazie można samodzielnie stworzyć kolejne.
Jak w przypadku wielu różnych tematów tak i w przypadku marki osobistej pojawiło się przez…
Choć zabrzmi to może nieco dziwnie to wprowadzenie AI (sztucznej inteligencji) do naszego życia było…
Widmo Brockenu to dość rzadko spotykane zjawisko optyczne, najczęściej widywane w wysokich partiach gór. Można…
Zacznę może od tego, że relikwia, relikwii nie równa. Wiem jeśli nie ma się pojęcia…
Logo stanowi jeden z ważniejszych elementów tożsamości wizualnej praktycznie każdej firmy, marki czy projektu. Logo…
Budując własną markę osobistą lub chcąc ją zbudować trzeba liczyć się z wieloma wyzwaniami. Jednym…