Hur du installerar Bootstrap

Bootstrap är en öppen källkodswebram. Det används främst för front-end utveckling. Det är kostnadsfritt. Bootstrap utvecklades av Bootstrap Core Team. Bootstrap skapades ursprungligen av Mark Otto och Jacob Thornton. Det släpptes ursprungligen år 2011. Det skrevs i HTML, CSS och JavaScript.

Bootstrap-paket

Detta paket innehåller följande artiklar:

  1. CSS : Det kallas Cascading-formatmall som används för att utforma HTML-elementen.
  2. Komponenter : I Bootstrap-paketet finns det många återanvändbara komponenter för dropdowns, ikonografi, varningar, navigering etc.
  3. Anpassa : I Bootstrap-paketet kan komponenterna anpassas, mindre variabla och Jquery-plugins för att få stilen.
  4. Byggnadsställningar : I ett bootstrap-paket ger det grundstrukturen med rutnätssystemet, länkstil och bakgrund.
  5. JavaScript : I ett bootstrap-paket finns det JavaScript-plug-ins.

Steg för att installera Bootstrap

Låt oss diskutera stegen som krävs för att installera Bootstrap.

Steg 1: Använd länken nedan för att ladda ner bootstrap. Klicka på Hämta, bootstrap-paketet kommer att laddas ner i en zip-mapp. Den här mappen innehåller mappen CSS och JS.

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

Bootstrap-paketet som laddas ner är redo att använda kompilerad kod och som enkelt kan integreras i projektet. Det består av sammanställda och minifierade CSS-paket och Javascript Plugins.

Steg 2: Källfil : Bootstrap kan sammanställas med egen tillgångs pipeline med hjälp av javascript, sass och dokumentationsfiler.

Klicka på Hämta källa för att hämta filerna. Den innehåller js, CSS och andra filer.

Steg 3: Package Managers: Bootstrap kan installeras i Node.js-drivna filer eller applikationer.

$ npm install bootstrap

Steg 4: För Node.js-applikationer kan bootstrap också installeras med hjälp av garnpaket.

$ yarn add bootstrap

Steg 5: Om användaren vill installera bootstrap för ruby ​​juvelerapplikationer

  • Med hjälp av bundler : gem 'bootstrap', '~> 4.0.0'
  • Utan paket : $ gem install bootstrap –v 4.0.0

Steg 6: Kompositören kan användas för att installera och hantera bootstraps sass och javascript

$ Composer require twbs/bootstrap: 4.0.0

Steg 7: Med NuGet kan du installera och hantera bootstraps CSS och sass och javascript for.Net-applikationer.

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

Steg 8: Jquery används också med bootstrap-filer eller installationsmapp. Jquery måste laddas ner och placera Jquery-filen i Bootstrap-rotmappen för att uppleva det bättre användargränssnittet, och viktigast av allt förbättrar Jquery funktionerna i bootstrap som ger utseendet mer attraktivt och lyhörd.

Steg 9: Efter genomförandet av ovanstående steg kan utvecklaren skriva HTML-koden för att länka alla filerna för HTML-sidan och kan öppna HTML-filen för att kontrollera svaret.

Webbläsare som stöds

Bootstrap stöder främst den senaste och stabila versionen av all webbläsare och plattform. Webbläsaren för mobila enheter har stöttats Android- och IOS-plattformen. Desktop-webbläsare för olika plattformar som Mac och Windows stöds också av bootstrap.

Bootstrap-filstruktur

  • Bootstrap har förkompilerats, den sammanställda versionen av bootstrap laddas ner och extrahera Zip-filen och följande filstruktur ser du:

Ovanstående figur inkluderar mappfilerna för teckensnitt samt om utvecklaren behöver extra teckensnitt för att göra användargränssnittet enligt krav kan inkludera att filer som är tillgängliga i källpaketet med bootstrap. Källkoden för bootstrap har en mer detaljerad filstruktur.

Bootstrap 4

Det finns väsentliga förändringar som görs i Bootstrap 4 som omskrivning av koden huvudsakligen, CSS flexibel storlekstöd, navigationsanpassningsalternativ har lagts till, responsavstånd och storleksverktyg läggs till, den globala teckensstorleken ökas från 14px till 16px, antalet verktyg klasser läggs till, stylingknapp, rullgardinsmenyer, mediaobjekt och bildklasser läggs till. Det stöder också den senaste versionen av webbläsare.

Huvudfunktionen i Bootstrap är att förenkla utvecklingen av webbsidor. Det främsta skälet till att använda bootstrap är valet av färg, storlek, teckensnitt och layout för att projicera. Det ger grundläggande stildefinitioner för HTML-element. Jquery-plugins och Javascript-komponenter tillhandahåller några ytterligare element som kan användas för användargränssnitt som dialogrutor och verktygstips etc. Bootstrap-komponenterna består också av element i HTML, CSS-deklarationer och Javascript-kod. Den har också en funktion för att utöka de befintliga gränssnittselementen.

Den andra huvudkomponenten i bootstrap är dess layoutkomponenter. Den grundläggande layoutkomponenten kallas en behållare där varje element på sidan placeras i den. Behållaren placeras på webbsidan då andra layoutkomponenter som CSS-layout kan definieras genom rader och kolumner. Det beror på utvecklaren att välja vilken behållare fast bredd eller fluidbreddbehållare för utformning av webbsidan. Den förstnämnda använder de fyra fördefinierade bredderna men senare använder fyllningarna beror på storleken på skärmen på vilken webbsidan visas.

Användning av bootstrap

Bootstrap är mycket lätt att använda och med hjälp av bootstrap används utvecklare för att utveckla responsiva webbplatser. Bootstrap används också eftersom det stöder många webbläsare som Google Chrome, Mozilla Firefox, Internet Explorer, safari, opera etc. Bootstrap är lätt att komma igång och skapa ett responsivt rutnätssystem. Det har medföljer javascript plug-ins och det finns en lista över företag att använda. Det har bra dokumentation för att starta och kunna arbeta snabbt. Bootstrap har visat responsiv design och mobil första tillvägagångssätt. Det är öppen källkod och kostnadsfritt. Det sparar mycket ansträngning och tid. Det är anpassningsbart. Den viktiga användningen av bootstrap är lyhörd webbdesign, vilket hjälper till att anpassa webbplatsen efter skärmstorlek för alla enheter som bärbar dator, skrivbord, mobiltelefon och surfplatta.

Slutsats - Hur man installerar Bootstrap

Bootstrap använder sig vanligtvis som ett front-web-ramverk. Det stöder också många programmeringsspråk och plattformsoberoende. Det har utmärkt support på nätet för nybörjare för att hjälpa och dokumentation är också bra på den officiella sajten där alla uppdateringar avseende lanseringen av en ny version och de avancerade funktionerna har publicerats och dokumenterats korrekt. Det har blivit den populära webbramen för att bygga olika verktyg och integreras med ett annat skriptspråk.

Rekommenderade artiklar

Detta har varit en guide för hur du installerar Bootstrap. Här har vi diskuterat stegen för att installera bootstrap och även det grundläggande konceptet för Bootstrap 4 och användning av Bootstrap. Du kan också titta på följande artiklar för att lära dig mer -

  1. Hur man använder Bootstrap-kommandon
  2. Bootstrap intervjufrågor med svar
  3. Jämförelser av Bootstrap och WordPress
  4. Installation av WordPress

Kategori: