Přehled Bootstrapu
Bootstrap je frontendový framework, který vám pomáhá navrhovat webová rozhraní s hotovými komponentami CSS a JavaScript pro běžné prvky, jako je navigace, formuláře a tlačítka. Má také responzivní systém rozvržení mřížky, který upraví váš web pro zařízení s různými velikostmi obrazovky, jako jsou telefony a tablety. Pomocí systému rozloření Bootstrap je možné vytvořit jediný web, který vypadá dobře na všech zařízeních, která může zákazník používat.
Šablony Power Pages používají standardní komponenty Bootstrap s minimálními vlastními styly. Pomocí těchto šablon můžete snadno změnit motiv (fonty, barvy atd.), aby konzistentně odpovídal vaší značce a preferencím na celém vašem webu.
Power Pages podporuje Bootstrap verze 3.3.6 a Bootstrap verze 5. Bootstrap verze 5 nabízí vylepšené uživatelské prostředí (UX) a nové komponenty, jako je pozice položky typu accordion, offcanvas a podpora RTL.
U nových webů Power Pages budete muset nastavit Bootstrap verze 5 ve vašem prostředí. Můžete také migrovat své stávající weby Bootstrap verze 3 na verzi 5.
Prizpůsobení bootstrap
K úpravě Bootstrap změníte hodnoty proměnných a potom stáhnete vlastní verzi Bootstrap kompilovanou s vašimi vlastními hodnotami.
Síla proměnných Bootstrap spočívá v tom, že definují všechny styly v rámci, ne pouze jeden prvek. Například proměnná @font-size-base určuje výchozí velikost textu na vašem webu – hlavní text, nadpisy a všechny ostatní textové prvky. Nadpis H1 může být definován jako 300 procent z @font-size-base. Nastavením této jediné proměnné tak můžete jednotným způsobem řídit celý typografický rozsah webu.
Můžete si vytvořit vlastní verzi Bootstrap prostřednictvím oficiálního webu Bootstrap nebo použít web třetí strany, který může nabídnout jednodušší rozhraní nebo předem navržené motivy. Oficiální web pro úpravy Bootstrap poskytuje více informací o vlastním nastavení Bootstrap.
Když stáhnete upravenou verzi Bootstrapu, obsahuje následující adresářovou strukturu:
css/
|-- bootstrap.min.css
img/
|-- glyphicons-halflings-white.png
|-- glyphicons-halflings.png
js/
|-- bootstrap.min.js
V závislosti na typu použité aplikace úpravce může adresářová struktura obsahovat pouze bootstrap.min.css. Je to soubor, který obsahuje vaše přizpůsobení. Ostatní soubory jsou stejné pro všechny vlastní verze Bootstrapu a jsou již součástí vašeho webu.