Cum se instalează Bootstrap

Bootstrap este un cadru web open source. Este utilizat în principal pentru dezvoltarea front-end. Este gratuit. Bootstrap a fost dezvoltat de către Bootstrap Core Team. Bootstrap a fost inițial creat de Mark Otto și Jacob Thornton. A fost lansat inițial în anul 2011. A fost scris în HTML, CSS și JavaScript.

Pachetul Bootstrap

Acest pachet conține următoarele elemente:

  1. CSS : Se numește foaie de stil în cascadă care este folosită pentru stilul elementelor HTML.
  2. Componente : în pachetul Bootstrap, există o mulțime de componente refolosibile pentru dropdown, iconografie, alerte, navigare etc.
  3. Personalizare : În pachetul Bootstrap, componentele pot fi personalizate, mai puțin variabile și plugin-uri Jquery pentru a obține stilul.
  4. Schelă : într-un pachet bootstrap, oferă structura de bază cu sistemul de grilă, stilul de legătură și fundalul.
  5. JavaScript : într-un pachet bootstrap, vor exista plugin-uri javascript.

Pași pentru instalarea Bootstrap

Haideți să discutăm pașii necesari pentru instalarea Bootstrap.

Pasul 1: Folosiți linkul de mai jos pentru a descărca bootstrap-ul. Faceți clic pe Descărcare, pachetul bootstrap va fi descărcat într-un folder Zip. Acest folder conține folderul CSS și JS.

https://getbootstrap.com/docs/4.0/getting-started/download/

Pachetul de bootstrap care este descărcat este gata de a utiliza cod compilat și care poate fi integrat cu ușurință în proiect. Este format din pachete CSS compilate și minificate și plugin-uri Javascript.

Pasul 2: Fișier sursă : Bootstrap poate fi compilat cu propria conductă de resurse cu ajutorul fișierelor javascript, sass și documentare.

Faceți clic pe Descărcare sursă pentru a descărca fișierele. Conține js, CSS și alte fișiere.

Pasul 3: Manager de pachete: Bootstrap poate fi instalat în fișiere sau aplicații alimentate de Node.js.

$ npm install bootstrap

Pasul 4: Pentru aplicațiile Node.js, bootstrap-ul poate fi instalat și cu ajutorul pachetului de fire.

$ yarn add bootstrap

Pasul 5: Dacă utilizatorul dorește să instaleze bootstrap pentru aplicații cu pietre de rubin

  • Utilizarea pachetului : gem 'bootstrap', '~> 4.0.0'
  • Fără pachet : $ gem install bootstrap –v 4.0.0

Pasul 6: Compozitorul poate fi folosit pentru a instala și gestiona bootstraps sass și javascript

$ Composer require twbs/bootstrap: 4.0.0

Pasul 7: Utilizând NuGet, puteți instala și gestiona bootstraps CSS și sass și javascript pentru.Net.

  • Install-Package bootstrap
  • Install-Package bootstrap.sass

Pasul 8: Jquery este de asemenea utilizat cu fișiere bootstrap sau folder de instalare. Trebuie să descărcați Jquery și să plasați fișierul Jquery în folderul rădăcină Bootstrap pentru a experimenta o interfață de utilizator mai bună și, cel mai important, Jquery îmbunătățește caracteristicile bootstrap-ului care oferă aspectul mai atractiv și mai receptiv.

Pasul 9: După executarea etapelor de mai sus, dezvoltatorul poate scrie codul HTML pentru a lega toate fișierele pentru pagina HTML și poate deschide fișierul HTML pentru a verifica răspunsul.

Navigatoare acceptate

Bootstrap-ul acceptă în principal cea mai recentă și stabilă versiune a browserului și platformei. Browserul dispozitivelor mobile a fost acceptat platforma Android și IOS. Browser-urile desktop pentru diferite platforme precum Mac și Windows sunt, de asemenea, suportate de bootstrap.

Structura fișierului Bootstrap

  • Bootstrap a fost precompilat, versiunea compilată a bootstrap-ului fiind descărcată și extrageți fișierul Zip și următoarea structură de fișiere pe care o veți vedea:

Figura de mai sus include, de asemenea, fișierele folderului fonturi, dacă dezvoltatorul necesită fonturi suplimentare pentru a face interfața de utilizator în conformitate cu cerințele pot include că fișierele care sunt disponibile în pachetul sursă de bootstrap. Codul sursă de bootstrap va avea o structură de fișier mai detaliată.

Cizmă 4

Există modificări semnificative în Bootstrap 4, cum ar fi rescrierea codului, majoritatea suportului CSS, au fost adăugate opțiuni de personalizare a navigației, spațiu de răspuns și utilitare de dimensionare, dimensiunea fontului global este crescută de la 14px la 16px, numărul de utilități sunt adăugate clase, buton de stilizare, meniuri derulante, obiecte media și clase de imagine. De asemenea, acceptă cea mai recentă versiune de browsere.

Principala caracteristică a Bootstrap este simplificarea dezvoltării paginilor web. Motivul principal pentru a utiliza bootstrap-ul este alegerea culorii, dimensiunii, fontului și aspectului de proiectare. Oferă definiții de bază ale stilului elementelor HTML. Plugin-urile Jquery și componentele Javascript oferă câteva elemente suplimentare care pot fi utilizate pentru interfața utilizatorului, precum casetele de dialog, și scrierile de instrumente etc. Componentele bootstrap-ului constau, de asemenea, din elemente HTML, declarații CSS și cod Javascript. De asemenea, are o caracteristică de extindere a elementelor de interfață existente.

Cealaltă componentă principală a bootstrap-ului este componentele sale de dispunere. Componenta de bază a aspectului se numește container în care se plasează în el fiecare element al paginii. Containerul este plasat pe pagina web, apoi alte componente ale layout-ului precum layout-ul CSS pot fi definite prin rânduri și coloane. Depinde de dezvoltator să aleagă ce container cu lățimea fixă ​​sau cu lățimea de fluid pentru proiectarea paginii web. Primul folosește cele patru lățimi predefinite, dar ulterior utilizează completările depinde de dimensiunea ecranului pe care pagina web este vizualizată.

Utilizarea bootstrap-ului

Bootstrap este foarte ușor de utilizat și cu ajutorul bootstrap-ului, dezvoltatorii obișnuiau să dezvolte site-uri web responsive. Bootstrap este, de asemenea, utilizat deoarece acceptă multe browsere precum Google Chrome, Mozilla Firefox, Internet Explorer, safari, opera etc. Bootstrap este ușor de început și de a crea un sistem de grilă receptiv. Are pachete de plugin-uri javascript și există o listă de companii de utilizat. Are o documentație bună pentru a începe și poate lucra rapid. Bootstrap a arătat un design receptiv și o primă abordare mobilă. Este open source și gratuit. Economisește mult efort și timp. Este personalizabil. Utilizarea importantă a bootstrap-ului este designul web sensibil, care ajută la ajustarea site-ului web în funcție de dimensiunea ecranului pentru toate dispozitivele, cum ar fi laptopul, desktopul, telefonul mobil și tableta.

Concluzie - Cum se instalează Bootstrap

Bootstrap folosește pe scară largă ca un cadru web front-end. Suporta multe limbaje de programare și independente de platformă. Are asistență comunitară excelentă pentru asistenți pentru începători, iar documentația este bună și pe site-ul oficial, unde toate actualizările privind lansarea unei noi versiuni și funcțiile avansate au fost publicate și documentate în mod corespunzător. A devenit cadrul popular pentru construirea de instrumente diferite și integrarea cu un alt limbaj de script.

Articole recomandate

Acesta a fost un ghid despre cum se instalează Bootstrap. Aici am discutat pașii pentru instalarea bootstrap-ului și, de asemenea, conceptul de bază al Bootstrap 4 și utilizarea Bootstrap. De asemenea, puteți consulta următoarele articole pentru a afla mai multe -

  1. Cum se utilizează Comenzile Bootstrap
  2. Întrebări cu interviu Bootstrap cu răspunsuri
  3. Comparații de Bootstrap și WordPress
  4. Instalarea WordPress