Enkla sätt att installera Bootstrap: 10 steg (med bilder)

Innehållsförteckning:

Enkla sätt att installera Bootstrap: 10 steg (med bilder)
Enkla sätt att installera Bootstrap: 10 steg (med bilder)

Video: Enkla sätt att installera Bootstrap: 10 steg (med bilder)

Video: Enkla sätt att installera Bootstrap: 10 steg (med bilder)
Video: En mapp från Google Fotos till programmet Bilder - på en Mac 2024, Maj
Anonim

Denna wikiHow lär dig hur du laddar ner Bootstrap -filer till din dator och länkar dem till dina HTML -texter för att använda Bootstrap -element i din kod. När du har laddat ner och länkat Bootstrap -filerna kan du börja använda alla formatmallar och JavaScript -element i Bootstrap i din webbdesign.

Steg

Installera Bootstrap Steg 1
Installera Bootstrap Steg 1

Steg 1. Öppna Bootstrap -webbplatsen i din webbläsare

Skriv https://getbootstrap.com i adressfältet och tryck på ↵ Enter eller ⏎ Return på tangentbordet.

Installera Bootstrap Steg 2
Installera Bootstrap Steg 2

Steg 2. Klicka på knappen Ladda ner

Detta öppnar sidan "Ladda ner".

Installera Bootstrap Steg 3
Installera Bootstrap Steg 3

Steg 3. Klicka på knappen Hämta nedan "Kompilerad CSS och JS

" Detta kommer att ladda ner de fullständiga Bootstrap -filerna till din dator som ett ZIP -arkiv.

Om du blir ombedd väljer du en sparplats för Bootstrap ZIP

Installera Bootstrap Steg 4
Installera Bootstrap Steg 4

Steg 4. Extrahera filerna från ZIP -arkivet

Hitta ZIP-filen som du just laddade ner och dubbelklicka på den för att extrahera alla filer i den till samma mapp.

  • Detta extraherar två mappar med namnet " css"och" js."
  • Om din uppackningsprogram inte extraherar filerna automatiskt, kolla in den här artikeln för att se alla sätt du kan exportera ett ZIP -arkiv.
Installera Bootstrap Steg 5
Installera Bootstrap Steg 5

Steg 5. Flytta de extraherade mapparna till samma mapp som din webbplats HTML -filer

Öppna mappen som innehåller alla webbplatsens HTML -filer och dra " css"och" js"mappar här för att flytta dem till samma mapp som dina webbplatsdokument.

Du kan nu länka filerna till dina HTML -filer och börja använda Bootstrap i din kod

Installera Bootstrap Steg 6
Installera Bootstrap Steg 6

Steg 6. Högerklicka på HTML-filen du vill använda med Bootstrap

Du kan bara använda Bootstrap i en av dina HTML -filer, eller alla.

Installera Bootstrap Steg 7
Installera Bootstrap Steg 7

Steg 7. Håll muspekaren över Öppna med på högerklick-menyn

En undermeny dyker upp med kompatibla appar.

Installera Bootstrap Steg 8
Installera Bootstrap Steg 8

Steg 8. Välj ditt textredigeringsprogram

Detta öppnar den valda HTML -filen i din textredigerare.

Du kan använda en enkel textredigerare som Anteckningsblock eller TextEdit samt en dedikerad kodredigerare som Atom (https://atom.io) eller Coda (https://panic.com/coda).

Installera Bootstrap Steg 9
Installera Bootstrap Steg 9

Steg 9. Lägg till Bootstrap -länkarna i HTML -filens rubrik

Innan du använder Bootstrap -koden i din HTML måste du skriva eller klistra in raderna nedan i rubriken på din kod:

Om du vill länka och använda några av de andra filerna från css- och js -mapparna lägger du bara till nya rader i rubriken och ersätter css/bootstrap.css- och js/bootstrap.js -delarna med namnen på filerna du vill ha att länka

Installera Bootstrap Steg 10
Installera Bootstrap Steg 10

Steg 10. Kontrollera placeringen av dina Bootstrap -länkar i koden

I HTML -rubriken ska båda raderna placeras mellan raderna och raden.

  • När du har lagt till dessa rader i rubriken kan du börja använda Bootstrap -element i den här HTML -filen.
  • Du hittar en fullständig lista över alla Bootstrap-element på https://getbootstrap.com/docs/4.3/getting-started/introduction. Klicka bara på någon kategori som Layout eller Komponenter på menyn till vänster.
  • När du har installerat Bootstrap kan du infoga eller kopiera/klistra in vilken kodbit som helst härifrån till din egen kod.

Rekommenderad: