Estendi · Bootstrap in italiano

Bootstrap è realizzato con LESS al suo interno, un linguaggio di fogli di stile dinamico creato dal nostro buon amico, Alexis Sellier . Rende lo sviluppo di CSS basati su sistemi più veloce, più facile e più divertente.

Perché MENO?

Uno dei creatori di Bootstrap ha scritto un breve post sul blog su questo , riassunto qui:

Bootstrap compila più velocemente ~ 6 volte più velocemente con Less rispetto a Sass
Meno è scritto in JavaScript, rendendo più facile per noi immergerci e applicare patch rispetto a Ruby con Sass.
Meno è di più; vogliamo sentirci come se stessimo scrivendo CSS e rendendo Bootstrap accessibile a tutti.

Cosa è incluso?

Come estensione di CSS, LESS include variabili, mixin per frammenti di codice riutilizzabili, operazioni per semplici funzioni matematiche, annidamento e persino funzioni di colore.

Scopri di più

Visita il sito ufficiale all'indirizzo http://lesscss.org/ per saperne di più.

Poiché il nostro CSS è scritto con Less e utilizza variabili e mixin, deve essere compilato per l'implementazione della produzione finale. Ecco come.

Nota: se stai inviando una richiesta pull a GitHub con CSS modificato, devi ricompilare il CSS tramite uno di questi metodi.

Strumenti per la compilazione

Riga di comando

Segui le istruzioni nel readme del progetto su GitHub per la compilazione tramite riga di comando.

JavaScript

Scarica l'ultimo Less.js e includi il percorso (e Bootstrap) nel file <head>.

<link rel = "stylesheet/less" href = "/path/to/bootstrap.less" > <script src = "/path/to/less.js" ></script>

Per ricompilare i file .less, salvali e ricarica la pagina. Less.js li compila e li archivia nella memoria locale.

App per Mac non ufficiale

L'app per Mac non ufficiale controlla le directory dei file .less e compila il codice in file locali dopo ogni salvataggio di un file .less visualizzato. Se lo desideri, puoi attivare le preferenze nell'app per minimizzare automaticamente e in quale directory finiscono i file compilati.

Più applicazioni

Croccante

Crunch è un ottimo editor e compilatore LESS basato su Adobe Air.

CodeKit

Creata dallo stesso ragazzo dell'app per Mac non ufficiale, CodeKit è un'app per Mac che compila LESS, SASS, Stylus e CoffeeScript.

Semplice

App per Mac, Linux e Windows per la compilazione trascina e rilascia di file LESS. Inoltre, il codice sorgente è su GitHub .

Avvia rapidamente qualsiasi progetto web inserendo CSS e JS compilati o minimizzati. Sovrapponi gli stili personalizzati separatamente per aggiornamenti e manutenzioni facili da portare avanti.

Imposta la struttura del file

Scarica l'ultimo Bootstrap compilato e inseriscilo nel tuo progetto. Ad esempio, potresti avere qualcosa del genere:

  app/
      layout/
      modelli/
  pubblico/
      css/
          bootstrap.min.css
      js/
          bootstrap.min.js
      immagine/
          glyphicons-halflings.png
          glyphicons-halflings-white.png

Utilizza il modello iniziale

Copia il seguente codice HTML di base per iniziare.

<html>
  <testa>
    <title> Modello Bootstrap 101 </title>
    <!-- Bootstrap -->
    <link href = "public/css/bootstrap.min.css" rel = "foglio di stile" >  
  </testa>
  <corpo>
    <h1> Ciao, mondo! </h1>
    <!-- Bootstrap -->
    <script src = "public/js/bootstrap.min.js" ></script> 
  </corpo>
</html>

Strato sul codice personalizzato

Lavora nel tuo CSS personalizzato, JS e altro se necessario per rendere Bootstrap tuo con i tuoi file CSS e JS separati.

<html>
  <testa>
    <title> Modello Bootstrap 101 </title>
    <!-- Bootstrap -->
    <link href = "public/css/bootstrap.min.css" rel = "foglio di stile" >  
    <!-- Progetto -->
    <link href = "public/css/application.css" rel = "stylesheet" >  
  </testa>
  <corpo>
    <h1> Ciao, mondo! </h1>
    <!-- Bootstrap -->
    <script src = "public/js/bootstrap.min.js" ></script> 
    <!-- Progetto -->
    <script src = "public/js/application.js" ></script> 
  </corpo>
</html>

Bootstrap esteso

Costruito con MENO