SynerGeek.fr Informatique & Veille Technologique
Parfois on est obligé de faire du développement web alors que ce n’est pas notre point fort. Surtout qu’on cherche toujours à faire quelque chose de propre et on se lance dans des div, du CSS et d’autres trucs immondes qui impactent sur le temps passé à développer.
Twitter a développé un petit framework CSS/Javascript qui simplifie de manière impressionnante le développement. De base il y a un design certes propre mais impersonnel. Sachez d’avance qu’il est possible de tout personnaliser.
Bootstrap s’adapte automatiquement aux navigateurs qu’ils soient mobiles ou non et peu importe les résolutions. Un outil qui peut parfois avoir l’air d’une bénédiction…
Le point fort et unique que je présenterai, c’est le scaffolding (positionnement). Votre page web devient une série de ligne, chaque ligne étant découpée en 12 colonnes.
Pour ajouter une ligne :
<div class=”row”>
Libre à vous de placer vos éléments comme vous le souhaitez dans les colonnes.
Par exemple, pour placer une div sur 3 colonnes en largeur on fait :
<div class=”span3″>
Elle prendra donc les 3 premières colonnes. Si je mets une autre div, elle prendra les colonnes suivantes.
Pour insérer un décalage, je peux mettre un offset :
<div class=”span3 offset3″>
Dans ce cas, ça laisse 3 colonnes vides et ça utilise les 3 colonnes suivantes.
Et voilà, il n’y a pas plus à savoir 🙂
http://twitter.github.com/bootstrap/scaffolding.html
Vous pouvez tout de même bénéficier de jolis boutons, de formulaires, de listes déroulantes etc…
