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
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.
Krok 2. Kliknij przycisk Pobierz
Spowoduje to otwarcie strony „Pobierz”.
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
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.
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
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.
Krok 7. Najedź kursorem na Otwórz za pomocą menu prawego przycisku myszy
Pojawi się podmenu z kompatybilnymi aplikacjami.
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).
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ć
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.