Twitter Bootstrap 101 Personalizza

Incorporato in Twitter La documentazione di Bootstrap è una comoda pagina Personalizza, che fornisce un modo rapido per implementare una combinazione di colori personalizzata, una tipografia personalizzata e una serie di altre personalizzazioni CSS. Ovviamente, l'approccio più efficace è quello di lavorare direttamente con i file LESS di Bootstrap. Ma con alcune regolazioni rapide, e per coloro che preferiscono lavorare in CSS dritti, questa pagina ti offre un ottimo modo per far ripartire le tue personalizzazioni.


Personalizza colori e tipografia

In questo screencast, ti guiderò attraverso la conversione di un sito Bootstrap di base in uno schema di colori scuri. Daremo una barra di navigazione più alta e inseriremo un paio di caratteri Web di Google. Il processo è veloce e abbastanza indolore!

In un breve video di follow-up, ti mostrerò come controllare gli errori che possono interrompere la creazione dei tuoi file CSS personalizzati. Dovrai fare attenzione a questi ed essere in grado di tornare indietro e correggerli quando si verificano. Ti mostrerò come è fatto.

Alla fine, molti di voi troveranno questo un ottimo modo per far girare la palla per i tuoi progetti personalizzati.


In alternativa, scarica il video o iscriviti a Webdesigntuts + screencast tramite YouTube

Guarda per errori!

Anche un piccolo refuso può introdurre un errore nel processo di personalizzazione. Dovrai cercare un file "error.txt". Se viene visualizzato insieme al tuo CSS personalizzato, devi aprirlo e utilizzarlo per aiutarti a trovare e correggere le voci che generano errori nella pagina Personalizza. Lascia che ti mostri un esempio!


In alternativa, scarica il video o iscriviti a Webdesigntuts + screencast tramite YouTube

risorse

Durante questi video abbiamo usato:

  • Bootstrap's Customize Page
  • Google Web Fonts

Potresti anche trovare utile fare riferimento ai valori di colore e tipografia usati nello screencast: