Conexiune (instalare) bootstrap la site-ul, șeful IT

În această lecție veți învăța cum să vă conectați platforma Twitter Bootstrap 3 site-ul web si de a invata, de asemenea, din ce fișier este.

Formulare Twitter Bootstrap platformă de distribuție

Pentru a studia platforma Twitter Bootstrap trebuie să aibă:

Twitter Bootstrap 3 platforma vine în două versiuni disponibile pentru descărcare:

  • compilat și versiunea redusă la minimum;
  • versiune a codului sursă.

În această lecție ne vom uita la conexiunea precompilate și versiunea redusă la minimum, care poate fi descărcat de la link-ul de mai sus. În această formă, platforma de livrare Twitter Bootstrap 3 pentru că avem cel mai mare interes este redusă la minimum versiunea (scurtă) a fișierului compilate, deoarece acestea sunt mai mici și, în consecință, crește paginile site-ului viteza de încărcare.

Dar, înainte de a merge la platforma Twitter Bootstrap conectarea la pagina web pe care trebuie să ia în considerare structura sa la nivelul de fișier.

Structura de fișiere platformă Bootstrap 3

După încărcare, pre-compilate, și o versiune minimizată a Bootstrap 3 pe un calculator, acesta trebuie să fie despachetat de către orice Archiver în directorul proiectului dvs. de web.

În cazul în care acest dosar se vedea, vom vedea că platforma Twitter Bootstrap este format din 3 director ( „CSS“, „fonts“ și „JS“) și fișiere.

Fișierele platformă sunt în 2 tipuri:

În plus față de aceste fișiere, această sursă include 4 mai multe fișiere de font "Glyphicons" (glyphicons-halflings-regular.eot. Glyphicons-halflings-regular.svg. Glyphicons-halflings-regular.ttf. Glyphicons-halflings-regular.woff), care acestea diferă unul de altul numai în formatul în care este stocat font. Font „Glyphicons“ este format din 200 de icoane din setul de „Glyphicon Halflings“.

Notă: pentru Twitter Bootstrap 3 platforma de scripting (bootstrap.js și bootstrap.min.js), trebuie să fi conectat cea mai recentă versiune a bibliotecii jQuery.

Crearea unui HTML 5 și conectați pagini web la platforma de Twitter Bootstrap 3

Astfel, am analizat structura și scopul Twitter Bootstrap fișiere 3. Platforma Acum este timpul pentru a conecta platforma cu ajutorul fișierului compilat și pentru a minimiza pagina web. Luați în considerare acest proces, pas cu pas. Ca rezultat al acțiunilor noastre, dorim să obțineți o pagină web de pe HTML 5, care este conectat la Twitter Bootstrap 3. Platforma Pentru a demonstra că lucrările platforma, vom crea în acest buton site-ul, atunci când faceți clic, va afișa un panou pop-up cu mesajul.

Pasul 1: Crearea unei pagini HTML

Pasul 2. Bootstrap 3 platforma Conectați-vă la o pagină web

Pentru a conecta Twitter Bootstrap 3 platforma de la o pagină Web, efectuați următoarele:

Pasul 3: Salvați pagina Web și va verifica funcționarea componentelor Bootstrap

După crearea unei pagini web, care este conectat la platforma Twitter Bootstrap 3, acesta trebuie să fie salvate într-un fișier cu extensia html (de exemplu: „index.html“). După aceea, creați o pagină web care aveți nevoie pentru a deschide un browser web și de a testa componenta Bootstrap „popovers“.

Structura de fișier al proiectului, bazat pe o platforma de Twitter Bootstrap 3 Locul:

Demonstrarea Bootstrap componentei „popovers“:

Bună ziua. dacă orice mod posibil de a determina elementele care vor fi folosite numai bootstrap.min.css
Acest lucru nu s-ar fi folosit în style.css stilul de bază numai pentru elementele \ Sarcini selectate.

Bună ziua.
Fișierul conține stiluri bootstrap.css generale care sunt aplicate în mod implicit la cele mai multe elemente HTML și stiluri pe care le specificați elemente folosind clase Bootstrap.

Pentru a ști ce stiluri sunt suprapuse pe elementul: deschide un browser (de exemplu: Google Chrome) -> apăsați tasta F12 -> deschide fila Elemente -> selectați elementul dorit din arbore sau din pictograma „lupa“ -> studia conținutul panoul din dreapta.

articole similare