Del via


Bootstrap-oversigt

Bootstrap er en frontend-ramme, der hjælper dig med at designe webgrænseflader med færdige CSS - og JavaScript-komponenter til almindelige elementer som navigation, formularer og knapper. Den har også et responsivt gitterlayoutsystem, der justerer dit websted til enheder med forskellige skærmstørrelser, såsom telefoner og tablets. Ved hjælp af Bootstrap-layoutsystemet er det muligt at oprette et enkelt websted, der giver en passende grænseflade til alle de enheder, dine kunder måtte bruge.

Power Pages skabeloner bruger standard Bootstrap-komponenter med minimale brugerdefinerede stilarter. Ved at bruge disse skabeloner kan du nemt ændre temaet (skrifttyper, farver og så videre) for at matche dit brand og dine præferencer konsekvent på tværs af hele dit websted.

Power Pages understøtter Bootstrap version 3.3.6 og Bootstrap version 5. Bootstrap version 5 tilbyder forbedrede brugeroplevelsesfunktioner (UX) og nye komponenter som harmonika, offcanvas og RTL-understøttelse.

Til nye Power Pages-websteder skal du konfigurere Bootstrap version 5 i dit miljø. Du kan også overføre eksisterende Bootstrap version 3-websteder til version 5.

Tilpasse Bootstrap

Tilpas Bootstrap ved at ændre værdierne i variablerne, og hent derefter en version af Bootstrap, der er kompileret med dine tilpassede værdier.

Styrken ved Bootstrap-variabler er, at de definerer alle stilarterne i rammen, ikke kun ét element. For eksempel angiver variablen @font-size-base standardstørrelsen af tekst på dit websted – brødtekst, overskrifter og alle andre tekstelementer. En H1-overskrift kan defineres som 300 procent af @font-size-base. Ved at indstille denne ene variabel styrer du hele den typografiske skala for dit websted på en ensartet måde.

Du kan oprette en brugerdefineret version af Bootstrap gennem det officielle Bootstrap-websted eller bruge et tredjepartswebsted, der muligvis tilbyder en lettere grænseflade eller foruddesignede temaer. Det officielle websted for Bootstrap-tilpasseren indeholder flere oplysninger om Bootstrap-tilpasning.

Når du downloader en tilpasset version af Bootstrap, indeholder den følgende mappestruktur:

css/
    |-- bootstrap.min.css 
img/
    |-- glyphicons-halflings-white.png 
    |-- glyphicons-halflings.png 
js/ 
    |-- bootstrap.min.js

Afhængigt af det tilpasserprogram, der bruges, indeholder den måske kun bootstrap.min.css. Det er filen, der indeholder dine tilpasninger. De andre filer er de samme for alle tilpassede versioner af Bootstrap og er allerede inkluderet i dit websted.

Næste trin

Se også