Poniżej znajdziecie kilka ciekawych przykładowych zastosowań do różnych celów tabów (zakładek).
Co znajdziesz w tym wpisie
Czym charakteryzują się tabs?
Tab jak sama nazwa mówi taby są formą zakładki umieszczanej na stronie internetowej. Wykorzystywane są one do różnych celów. Najczęściej do skrócenia długości strony przy jednoczesnej segregacji treści. Brzmi dziwnie jednak w praktyce wiąże się to tak jakby z utworzeniem dodatkowego menu z „zakładkami”.
Ciekawy przesuwający się tab wykonany z myślą o menu do jedno stronicowej strony internetowej. Nagłówki tabów mogą się chować i pokazywać.
See the Pen Horizontal Tab Menu by Ettrics (@ettrics) on CodePen.
css tabs
by massimo
Tab przypominający kolorowe zakładki w notesie lub segregatorze. Przechodzenia między tabami znajduję się z boku.
See the Pen css tabs by massimo (@_massimo) on CodePen.
Simple Bootstrap Side Tabs
by Jeremy Hawes
Kolejny tab w formie menu – tym razem bocznego. Tym razem zawartość pojawia się zastępując poprzednią.
See the Pen Simple Bootstrap Side Tabs by Jeremy Hawes (@jhawes) on CodePen.
Material Tabs
by Michael Richins
Ciekawy tab w postaci menu. Zawartość strony jest dynamiczne zastępowana.
See the Pen Material Tabs by Michael Richins (@MrGrigri) on CodePen.
Tabs
by Wallace Erick
Nieco bardziej klasyczny tab.
See the Pen Pure CSS Tabs by Wallace Erick (@wallaceerick) on CodePen.
Tabs
by Nikita Jadhao
See the Pen Tabs by Nikita Jadhao (@jdniki) on CodePen.
Responsive jQuery tabs
by Jonathan Clift
See the Pen Responsive jQuery tabs by Jonathan Clift (@cliftwalker) on CodePen.
Vertical Tabs With Material Design Lite
by Rahul Sagore
Ten ciekawy tab nie zmienia tym razem treści a grafikę.
See the Pen Vertical Tabs With Material Design Lite by Rahul Sagore (@rahul-sagore) on CodePen.
Adaptive tabs
by Lewi Hussey
Poniższy tab nie tylko posiada opcję dynamicznego przejścia miedzy zakładkami ale także zmienia się tło.
See the Pen Adaptive tabs by Lewi Hussey (@Lewitje) on CodePen.
Sexy Tabs
by Srdjan Pajdic
See the Pen Sexy Tabs by Srdjan Pajdic (@MightyShaban) on CodePen.
Taby z pomocą Bootstrap
Pills
Tabsy
W branży IT jestem już od 2007 roku. W tym czasie zajmowałam się głównie tematyką pozycjonowania i budowy stron internetowych. Hobbistycznie zajmuje się fotografią, podróżami (głównie tymi mikro). Interesuje się mitologią (Nordycką, Grecką i Rzymską) i historią.