Programmation Web Avancée

Blogue

Les cours

Casser la glace avec Bootstrap


Rédigé par , le
Bootstrap est une librarie créée par des employés de Twitter permettant de styliser des pages Web (boutons, liens, formulaires, layouts, ...). Elle est tenue à jour et elle est compatible à travers les différents navigateurs.


Exemple simple pour essayer BootStrap

Insérer les fichiers CSS et JavaScript de la librairie (accessible directement du site):
<script src="js/bootstrap.min.js"></script>
<link href="css/bootstrap.min.css" rel="stylesheet" />


Créer vos éléments HTML comme à l'habitude, mais en personnalisant le design via les classes CSS de Bootstrap.

Par exemple :
<div style="margin-bottom:20px;">
  Faire un lien : 
  <a href="http://twitter.github.com/bootstrap/base-css.html" class="btn btn-info">
    Styles de boutons
  </a>
</div>

<form action="" method="get">
  <div>
    Faire le bouton <code>submit</code> d'un formulaire
  </div>

  <div style="margin-top:10px">
    <input type="text" placeholder="Valeur par défaut" name="mot" />
  </div>
			
  <button class="btn btn-large btn-primary" type="submit">Sign in</button>
</form>

Ce code donnera le résultat suivant :

bootstrap

Simple et efficace !


Les commentaires sur cet article
Par : Anonyme
2013-03-08 12:48:25

Bon travail, continue!

Ajouter votre commentaire
(facultatif)
(facultatif et non divulgé)
Captcha image
Prenez le nombre affiché et faites moins 1.
 
Blog  

Les articles


Pour envoyer une demande d'assistance à l'enseignant, cliquez ici