Spisie treści
Jest to struktura promująca spójność za pomocą narzędzi wewnętrznych. Przed Bootstrapem do tworzenia interfejsu użytkownika używano różnych bibliotek, co prowadziło do niespójności i dużego obciążenia pracami konserwacyjnymi.
Bootstrap jest modułowy i zasadniczo składa się z serii arkuszy stylów, które implementują różnorodne komponenty narzędzia. Arkusz stylów o nazwie bootstrap.less zawiera komponenty arkusza stylów. Deweloperzy mogą dostosować ten sam plik Bootstrap, wybierając komponenty, których chcą użyć w swoim projekcie.
Narzędzia i klasy dostępne w Bootstrap
System gangów i responsywny design
Bootstrap ma standardowy układ siatki o szerokości 940 pikseli. Alternatywnie deweloper może użyć układu o zmiennej szerokości. Spowoduje to automatyczne dostosowanie szerokości kolumn.
Arkusz stylów CSS
Bootstrap dostarcza zestaw arkuszy stylów, które zawierają podstawowe definicje stylów dla wszystkich komponentów HTML. Daje to jednolitość przeglądarce i systemowi szerokości, daje nowoczesny wygląd formatowania elementów tekstowych, tabel i formularzy.
Komponenty wielokrotnego użytku
Zwykłe elementy HTML, Bootstrap, zawierają inny powszechnie używany interfejs elementów. Zawiera przyciski z zaawansowanymi funkcjami, takimi jak grupa przycisków lub przyciski z opcjami menu rozwijanego, listy nawigacyjne, etykiety poziome i pionowe, menu nawigacyjne, paginacja, etykiety, zaawansowane funkcje miniatur typograficznych, formaty komunikatów ostrzegawczych i paski postępu.
Wtyczki JavaScript i jQuery
Komponenty Javascript dla Bootstrap są oparte na bibliotece JavaScript jQuery. Wtyczki znajdują się w narzędziu wtyczki jQuery. Zapewniają dodatkowe elementy interfejsu użytkownika, takie jak okna dialogowe, podpowiedzi i karuzele.
Rozszerzają również funkcjonalność niektórych istniejących elementów interfejsu, w tym na przykład funkcję autouzupełniania dla pól wejściowych. Wersja 2.0 obsługuje następujące wtyczki JavaScript: Modal, Dropdown, Scrollspy, Tab, Tooltip, Popover, Alert, Button, Collapse, Carousel i Typeahead.
Aby użyć Bootstrap na stronie HTML, programista musi tylko pobrać arkusz stylów Bootstrap CSS i połączyć go w pliku HTML.
Pobierz skompilowany kod CSS i JavaScript, co jest najłatwiejszym sposobem na rozpoczęcie pracy z Bootstrapem. Minusem jest to, że ta wersja nie zawiera oryginalnych plików ani dokumentacji. Aby pobrać tę wersję, przejdź do getbootstrap.com i naciśnij przycisk Pobierz Bootstrap.
Możemy również wybrać link do plików startowych z serwerów zewnętrznych w następujący sposób:
Aby korzystać z tych plików, zmodyfikuj następujące linki na swoich stronach
Po rozpakowaniu pliku, który pobrałeś ze skompilowaną wersją Bootstrap, zobaczysz następującą strukturę plików i katalogów:
ładowacz /
css /
│ ├── bootstrap.css
bootstrap.min.css
bootstrap-theme.css
Bootstrap-theme.min.css
js /
bootstrap.js
bootstrap.min.js
└── czcionki /
├── glyphicons-halflings-regular.eot
├── glyphicons-halflings-regular.svg
├── glyphicons-halflings-regular.ttf
└── glify-halflings-regular.woff
Te pliki to biblioteki, które składają się na bootstrap, później zobaczymy komponenty i sposób ich użycia.Podobał Ci się i pomógł ten samouczek?Możesz nagrodzić autora, naciskając ten przycisk, aby dać mu pozytywny punkt
