Proste sposoby instalacji Bootstrapa: 10 kroków (ze zdjęciami)

Spisu treści:

Proste sposoby instalacji Bootstrapa: 10 kroków (ze zdjęciami)
Proste sposoby instalacji Bootstrapa: 10 kroków (ze zdjęciami)

Wideo: Proste sposoby instalacji Bootstrapa: 10 kroków (ze zdjęciami)

Wideo: Proste sposoby instalacji Bootstrapa: 10 kroków (ze zdjęciami)
Wideo: ⭐️ TikTok: Jak przesyłać filmy wyższej jakości? ⭐️ 2024, Może
Anonim

Ta wikiHow uczy, jak pobierać pliki Bootstrap na komputer i łączyć je z tekstami HTML, aby używać elementów Bootstrap w kodzie. Po pobraniu i połączeniu plików Bootstrap możesz zacząć używać wszystkich elementów arkusza stylów i JavaScript w Bootstrap w swoim projekcie strony internetowej.

Kroki

Zainstaluj Bootstrap Krok 1
Zainstaluj Bootstrap Krok 1

Krok 1. Otwórz stronę Bootstrap w swojej przeglądarce internetowej

Wpisz https://getbootstrap.com w pasku adresu i naciśnij ↵ Enter lub ⏎ Return na klawiaturze.

Zainstaluj Bootstrap Krok 2
Zainstaluj Bootstrap Krok 2

Krok 2. Kliknij przycisk Pobierz

Spowoduje to otwarcie strony „Pobierz”.

Zainstaluj Bootstrap Krok 3
Zainstaluj Bootstrap Krok 3

Krok 3. Kliknij przycisk Pobierz poniżej „Skompilowane CSS i JS

" Spowoduje to pobranie pełnych plików Bootstrap na komputer jako archiwum ZIP.

Jeśli pojawi się monit, wybierz lokalizację zapisywania dla Bootstrap ZIP

Zainstaluj Bootstrap Krok 4
Zainstaluj Bootstrap Krok 4

Krok 4. Wyodrębnij pliki z archiwum ZIP

Znajdź właśnie pobrany plik ZIP i kliknij go dwukrotnie, aby wyodrębnić wszystkie znajdujące się w nim pliki do tego samego folderu.

  • Spowoduje to wyodrębnienie dwóch folderów o nazwie „ css" oraz " js."
  • Jeśli Twoja aplikacja do rozpakowywania nie rozpakowuje automatycznie plików, zapoznaj się z tym artykułem, aby zobaczyć wszystkie sposoby eksportowania archiwum ZIP.
Zainstaluj Bootstrap Krok 5
Zainstaluj Bootstrap Krok 5

Krok 5. Przenieś wyodrębnione foldery do tego samego folderu, co pliki HTML witryny

Otwórz folder zawierający wszystkie pliki HTML witryny i przeciągnij „ css" oraz " js" foldery tutaj, aby przenieść je do tego samego folderu, co dokumenty Twojej witryny.

Możesz teraz połączyć pliki z plikami HTML i zacząć używać Bootstrap w swoim kodzie

Zainstaluj Bootstrap Krok 6
Zainstaluj Bootstrap Krok 6

Krok 6. Kliknij prawym przyciskiem myszy plik HTML, którego chcesz użyć z Bootstrapem

Możesz użyć Bootstrap tylko w jednym z plików HTML lub we wszystkich.

Zainstaluj Bootstrap Krok 7
Zainstaluj Bootstrap Krok 7

Krok 7. Najedź kursorem na Otwórz za pomocą menu prawego przycisku myszy

Pojawi się podmenu z kompatybilnymi aplikacjami.

Zainstaluj Bootstrap Krok 8
Zainstaluj Bootstrap Krok 8

Krok 8. Wybierz swój program do edycji tekstu

Spowoduje to otwarcie wybranego pliku HTML w edytorze tekstu.

Możesz użyć prostego edytora tekstu, takiego jak Notatnik lub TekstEdytuj a także dedykowany edytor kodu, taki jak Atom (https://atom.io) lub Coda (https://panic.com/coda).

Zainstaluj Bootstrap Krok 9
Zainstaluj Bootstrap Krok 9

Krok 9. Dodaj linki Bootstrap do nagłówka pliku HTML

Zanim użyjesz kodu Bootstrap w swoim kodzie HTML, musisz wpisać lub wkleić poniższe wiersze do nagłówka kodu:

Jeśli chcesz połączyć i użyć niektórych innych plików z folderów css i js, po prostu dodaj nowe wiersze do nagłówka i zastąp części css/bootstrap.css i js/bootstrap.js nazwami żądanych plików łączyć

Zainstaluj Bootstrap Krok 10
Zainstaluj Bootstrap Krok 10

Krok 10. Sprawdź umiejscowienie linków Bootstrap w kodzie

W nagłówku HTML oba wiersze powinny znajdować się między wierszami a wierszem.

  • Po dodaniu tych wierszy do nagłówka możesz zacząć używać elementów Bootstrap w tym pliku HTML.
  • Pełną listę wszystkich elementów Bootstrap można znaleźć pod adresem https://getbootstrap.com/docs/4.3/getting-started/introduction. Wystarczy kliknąć dowolną kategorię, np. Układ lub składniki w lewym menu.
  • Po zainstalowaniu Bootstrap możesz wstawić lub skopiować/wkleić dowolny fragment kodu stąd do własnego kodu.

Zalecana: