w3tutoriels.com

Bootstrap Conteneur

Dans Bootstrap, le conteneur (container) est utilisé pour définir les marges du contenu traitant des comportements réactifs de votre mise en page. Il contient les éléments de ligne, et les éléments de ligne constituent le conteneur de colonnes (appelé système de grille).

La classe container est utilisée pour créer un contenu encadré.

Il existe deux classes de conteneur dans Bootstrap:

  1. container
  2. container-fluid

Voir la disposition de base d’un conteneur:

<html>  
 <body>  
  <div class="container">  
   <div class="row">  
     <div class="col-md-xx"></div>  
       ...  
   </div>  
   <div class="row">  
     <div class="col-md-xx"></div>  
       ...  
   </div>  
  </div>  
 </body>  
</html>

Exemple de conteneur bootstrap

<!DOCTYPE html>  
<html lang="en">  
  <head>  
     <title>Job</title>  
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"/>  
  </head>  
  <body>  
  
<div class="container">    
  <h1>Container</h1>    
  <p>container content</p>  
</div>    
    
<div class="container-fluid">    
  <h1>Container-fluid</h1>    
  <p>container-fluid content</p>  
</div>   
  
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>  
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>  
  </body>  
</html>

 

Quitter la version mobile