Junior
Porozprávajte mi o štandardoch používateľského rozhrania v Bootstrap.
sobes.tech AI
Odpoveď od AI
Bootstrap poskytuje súbor hotových štýlov a komponentov založených na HTML, CSS a JavaScript, ktoré umožňujú vytvárať jednotné a responzívne používateľské rozhranie. Kľúčové štandardy zahŕňajú:
- Mriežkový systém (Grid System): Adaptívny systém rozloženia s dvanástimi stĺpcami, ktorý uľahčuje tvorbu flexibilných štruktúr stránok. Implementuje sa pomocou tried
container,rowacol-*. - Typografia: Jednotné štýly pre nadpisy (
<h1>-<h6>), odstavce (<p>), zoznamy a ďalšie textové prvky, ktoré zabezpečujú čitateľnosť. - Formuláre: Štýlizované prvky formulárov (vstupné polia, tlačidlá, zaškrtávacie políčka, radiobuttony atď.) pre jednotný vzhľad a jednoduché použitie.
- Tlačidlá: Rôzne štýly a veľkosti tlačidiel, ktoré ukazujú ich účel (napríklad
btn,btn-primary,btn-secondary). - Navigácia: Komponenty na tvorbu navigačných menu (napríklad
navbar,nav-tabs,nav-pills). - Responzívnosť: Všetky komponenty a systém mriežok sa predvolene prispôsobujú rôznym veľkostiam obrazoviek (desktop, tablety, mobilné zariadenia) pomocou media queries.
- Komponenty: Široký výber hotových, štýlizovaných komponentov, ako sú:
- Upozornenia (Alerts)
- Odznaky (Badges)
- Karty (Cards)
- Modálne okná (Modals)
- Rozbaľovacie menu (Dropdowns)
- Nápovedy (Tooltips)
- Popovers
- Karusel (Carousel)
- Ikony: Integrácia s knižnicami ikon (napríklad Bootstrap Icons) na vizuálne označenie akcií alebo informácií.
- Pomocné triedy: Triedy na správu okrajov (
m-*,p-*), zarovnanie (text-*), zobrazenie (d-*) a ďalšie štýly bez písania dodatočného CSS.
Hlavným cieľom týchto štandardov je urýchliť vývoj, zabezpečiť konzistentnosť dizajnu v celej aplikácii a garantovať správne zobrazenie na rôznych zariadeniach.