Aanpassen
Leer hoe u Bootstrap kunt thematiseren, aanpassen en uitbreiden met Sass, een zee van globale opties, een uitgebreid kleurensysteem en meer.
Overzicht
Er zijn meerdere manieren om Bootstrap aan te passen. Uw beste pad kan afhangen van uw project, de complexiteit van uw build-tools, de versie van Bootstrap die u gebruikt, browserondersteuning en meer.
Onze twee voorkeursmethoden zijn:
- Bootstrap gebruiken via pakketbeheerder zodat u onze bronbestanden kunt gebruiken en uitbreiden.
- De gecompileerde distributiebestanden van Bootstrap of jsDelivr gebruiken , zodat u de stijlen van Bootstrap kunt toevoegen of negeren.
Hoewel we hier niet in details kunnen treden over het gebruik van elke pakketbeheerder, kunnen we wel wat richtlijnen geven voor het gebruik van Bootstrap met uw eigen Sass-compiler .
Voor degenen die de distributiebestanden willen gebruiken, raadpleegt u de startpagina voor het opnemen van die bestanden en een voorbeeld-HTML-pagina. Raadpleeg vanaf daar de documenten voor de lay-out, componenten en gedragingen die u wilt gebruiken.
Terwijl u vertrouwd raakt met Bootstrap, kunt u dit gedeelte verder verkennen voor meer informatie over het gebruik van onze algemene opties, het gebruik van en het wijzigen van ons kleursysteem, hoe we onze componenten bouwen, hoe u onze groeiende lijst met aangepaste CSS-eigenschappen gebruikt en hoe om uw code te optimaliseren bij het bouwen met Bootstrap.
CSP's en ingesloten SVG's
Verschillende Bootstrap-componenten bevatten ingesloten SVG's in onze CSS om componenten consistent en gemakkelijk op te maken voor verschillende browsers en apparaten. Voor organisaties met strengere CSP -configuraties hebben we alle instanties van onze ingesloten SVG's gedocumenteerd (die allemaal worden toegepast via background-image), zodat u uw opties grondiger kunt bekijken.
- Accordeon
- Sluitknop (gebruikt in waarschuwingen en modals)
- Formulier selectievakjes en keuzerondjes
- Vorm schakelaars
- Pictogrammen voor formuliervalidatie
- Menu's selecteren
- Carrouselbediening
- Navigatieknoppen op de navigatiebalk
Op basis van gemeenschapsgesprekken zijn enkele opties om dit in uw eigen codebase aan te pakken het vervangen van de URL's door lokaal gehoste middelen, het verwijderen van de afbeeldingen en het gebruik van inline-afbeeldingen (niet mogelijk in alle componenten) en het wijzigen van uw CSP. Onze aanbeveling is om uw eigen beveiligingsbeleid zorgvuldig door te nemen en zo nodig te beslissen over de beste weg vooruit.