Bootstrap tutorial logo

Typografia – listy / Lists

autor: Robert

1 lipca 2013

W poprzednim wpisie znalazło się prawie wszystko co można powiedzieć o typografii w bootstrapie. Do omówienia zostały jeszcze listy które postaram się przybliżyć poniżej.

Lista nieuporządkowana

  • Lorem ipsum dolor sit amet
  • Ut enim ad minim veniam
    • Duis aute irure dolor in reprehenderit
    • Excepteur sint occaecat cupidatat
  • Donec molestie elementum purus

Lista uporządkowana

  1. Lorem ipsum dolor sit amet
  2. Ut enim ad minim veniam
    1. Duis aute irure dolor in reprehenderit
    2. Excepteur sint occaecat cupidatat
  3. Donec molestie elementum purus

Lista bez „bulletów”

Aby stworzyć listę bez tzw „bulletów” należy skorzystać z klasy .list-unstyled. To formatowanie nie działa na listy zagnieżdzone.

  • Lorem ipsum dolor sit amet
  • Ut enim ad minim veniam
    • Duis aute irure dolor in reprehenderit
    • Excepteur sint occaecat cupidatat
  • Donec molestie elementum purus

Lista liniowa

Gdy chcemy by elementy naszej listy wyświetlały się obok siebie a nie pod sobą należy skorzystać z klasy .list-inline

  • Lorem ipsum
  • Ut enim ad minim
  • Donec molestie

Lista słownikowa

Pierwsze pojęcie
Definicja pierwszego pojęcia
Drugie pojęcie
Definicja drugiego pojęcia
Trzecie pojęcie
Definicja trzeciego pojęcia

Pozioma lista słownikowa

Tworzymy ją poprzez dodanie klasy .dl-horizontal

Pierwsze pojęcie
Definicja pierwszego pojęcia
Drugie pojęcie
Definicja drugiego pojęcia
Trzecie pojęcie
Definicja trzeciego pojęcia

Post się przydał? Oceń go proszę.
1 Gwiazdka2 Gwiazdki3 Gwiazdki4 Gwiazdki5 Gwiazdek (18 głosów, średnia: 4,89 na 5)
Loading...

Komentarze: Bądź pierwszy!