Modi semplici per installare Bootstrap: 10 passaggi (con immagini)

Sommario:

Modi semplici per installare Bootstrap: 10 passaggi (con immagini)
Modi semplici per installare Bootstrap: 10 passaggi (con immagini)

Video: Modi semplici per installare Bootstrap: 10 passaggi (con immagini)

Video: Modi semplici per installare Bootstrap: 10 passaggi (con immagini)
Video: L'APP SEGRETA PER SCARICARE QUALSIASI VIDEO!🎥 2024, Maggio
Anonim

Questo articolo spiega come scaricare i file Bootstrap sul tuo computer e collegarli ai tuoi testi HTML per utilizzare gli elementi Bootstrap nel tuo codice. Una volta scaricati e collegati i file Bootstrap, puoi iniziare a utilizzare tutti i fogli di stile e gli elementi JavaScript di Bootstrap nel tuo web design.

Passi

Installa Bootstrap Passaggio 1
Installa Bootstrap Passaggio 1

Passaggio 1. Aprire il sito Web Bootstrap nel browser Internet

Digita https://getbootstrap.com nella barra degli indirizzi e premi Invio o Invio sulla tastiera.

Installa Bootstrap Passaggio 2
Installa Bootstrap Passaggio 2

Passaggio 2. Fare clic sul pulsante Scarica

Si aprirà la pagina "Download".

Installa Bootstrap Passaggio 3
Installa Bootstrap Passaggio 3

Passaggio 3. Fare clic sul pulsante Download sotto "Compiled CSS and JS

" Questo scaricherà i file Bootstrap completi sul tuo computer come archivio ZIP.

Se ti viene richiesto, seleziona una posizione di salvataggio per Bootstrap ZIP

Installa Bootstrap Passaggio 4
Installa Bootstrap Passaggio 4

Passaggio 4. Estrarre i file dall'archivio ZIP

Trova il file ZIP appena scaricato e fai doppio clic su di esso per estrarre tutti i file nella stessa cartella.

  • Questo estrarrà due cartelle denominate " css" e " js."
  • Se la tua app di decompressione non estrae automaticamente i file, dai un'occhiata a questo articolo per vedere tutti i modi in cui puoi esportare un archivio ZIP.
Installa Bootstrap Passaggio 5
Installa Bootstrap Passaggio 5

Passaggio 5. Sposta le cartelle estratte nella stessa cartella dei file HTML del tuo sito web

Apri la cartella che contiene tutti i file HTML del tuo sito web e trascina il " css" e " js" qui per spostarle nella stessa cartella dei documenti del tuo sito web.

Ora puoi collegare i file ai tuoi file HTML e iniziare a utilizzare Bootstrap nel tuo codice

Installa Bootstrap Passaggio 6
Installa Bootstrap Passaggio 6

Passaggio 6. Fare clic con il pulsante destro del mouse sul file HTML che si desidera utilizzare con Bootstrap

Puoi utilizzare Bootstrap solo in uno dei tuoi file HTML o in tutti.

Installa Bootstrap Passaggio 7
Installa Bootstrap Passaggio 7

Passaggio 7. Passa il mouse su Apri con nel menu di scelta rapida

Verrà visualizzato un sottomenu con le app compatibili.

Installa Bootstrap Passaggio 8
Installa Bootstrap Passaggio 8

Passaggio 8. Seleziona il tuo programma di editor di testo

Questo aprirà il file HTML selezionato nel tuo editor di testo.

Puoi usare un semplice editor di testo come Bloc notes o TestoModifica così come un editor di codice dedicato come Atomo (https://atom.io) o codice (https://panic.com/coda).

Installa Bootstrap Passaggio 9
Installa Bootstrap Passaggio 9

Passaggio 9. Aggiungi i collegamenti Bootstrap all'intestazione del file HTML

Prima di utilizzare il codice Bootstrap nel tuo codice HTML, dovrai digitare o incollare le righe sottostanti nell'intestazione del codice:

Se si desidera collegare e utilizzare alcuni degli altri file dalle cartelle css e js, è sufficiente aggiungere nuove righe nell'intestazione e sostituire le parti css/bootstrap.css e js/bootstrap.js con i nomi dei file desiderati per collegare

Installa Bootstrap Passaggio 10
Installa Bootstrap Passaggio 10

Passaggio 10. Controlla il posizionamento dei tuoi link Bootstrap nel codice

Nell'intestazione dell'HTML, entrambe le righe dovrebbero trovarsi tra le righe e la riga.

  • Una volta aggiunte queste righe all'intestazione, puoi iniziare a utilizzare gli elementi Bootstrap in questo file HTML.
  • Puoi trovare un elenco completo di tutti gli elementi Bootstrap su https://getbootstrap.com/docs/4.3/getting-started/introduction. Basta fare clic su qualsiasi categoria come Disposizione o Componenti nel menu di sinistra.
  • Una volta installato Bootstrap, puoi inserire o copiare/incollare qualsiasi pezzo di codice da qui al tuo codice.

Consigliato: