Tutoriel Bootstrap

Bootstrap

Découvez les bases du plus célébre des frameworks CSS.

HTML HTML5 CSS Dreamweaver PHP

Jumbotron Bootsrap

Dans ce tutoriel, je vous propose de découvrir le composant Jumbotron vous permettant d'afficher un élément graphique que l'on place généralement en haut de page.
<div class="jumbotron">
<h1>Bonjour tout le monde!</h1>
<p>Ingeniis anim cernantur possumus, voluptate relinqueret et commodo est sed iis legam probant in si dolor incididunt despicationes. Quid occaecat hic coniunctione, nescius duis esse singulis anim eu illum ubi nostrud ab amet mentitum exercitation. Deserunt ea quae cernantur an legam occaecat quamquam et incurreret elit ab occaecat coniunctione, incididunt veniam an aliquip.</p>
<p><a href="#" class="btn btn-primary btn-lg" role="button" title="En savoir +">En savoir +</a></p>
</div>

Exemple

Bonjour tout le monde!

Ingeniis anim cernantur possumus, voluptate relinqueret et commodo est sed iis legam probant in si dolor incididunt despicationes. Quid occaecat hic coniunctione, nescius duis esse singulis anim eu illum ubi nostrud ab amet mentitum exercitation. Deserunt ea quae cernantur an legam occaecat quamquam et incurreret elit ab occaecat coniunctione, incididunt veniam an aliquip.

En savoir +


Pour avoir un jumbotron qui prend 100% de votre page, vous pouvez utiliser les classes .contaner et .container-fluid
<div class="jumbotron">
  <div class="container">
    ...
  </div>
</div>

ou

<div class="jumbotron">
  <div class="container-fluid">
    ...
  </div>
</div>

Tester

Page header

Le page header est comme un séparateur de section. La classe .page-header ajoute une ligne horizontale en dessous de l'élément.
<div class="page-header">
<h1>Example page header <small>Subtext for header</small></h1>
</div>

Exemple

Ce site est liste dans la categorie Enseignement et formation : Formations professionnelles de l'annuaire Référencement et Dictionnaire

Frédéric création Jardin | Concinnatis | Au petit grandeur | Lestrem TP | Jerico | Solumetal | Comonmarket | Chez Beau J'ai | Beukenne Traiteur | PDP Recouvrement | Agroé - Achat groupé d'énérgie | Achat goupé Sorea | CE LM énergie | placedesenergies.com | Gazon de la Folie | Dépannage pôele à  pellet | Création site web Nord | Rénovation habitat Pas de calais | Cuisine Bois | Créperie à  Valenciennes | Repar Coudre | DNS service | Archis 2 | 3MI | Tests d'orientation professionnels - Solutests | Ircl | Leblan promotion | Formation webmaster, PAO, CAO / DAO | Formateur Web, référencement et PAO | Formateur bureautique |