Ajoutez le doctype HTML 5: Bootstrap utilise des éléments HTML et des propriétés CSS. Vous devez donc ajouter le doctype HTML 5 au début de la page avec l’attribut lang et le bon jeu de caractères.
<!DOCTYPE html>
<html lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Titre de site</title>
</head>
<body>
//écrire un code
</body>
</html>
Bootstrap est adapté aux mobiles: Bootstrap 3 est conçu pour répondre aux besoins des appareils mobiles.
Les styles Mobile-first font partie du plateforme principal de Bootstrap.Vous devez ajouter la balise <meta> suivante dans l’élément <head> pour obtenir un rendu correct et un zoom tactile:
<meta name="viewport" content="width=device-width, initial-scale=1">
Remarque: La partie « width = device-width » sert à définir la largeur de la page afin qu’elle suive la largeur de l’écran du périphérique (varie en fonction des périphériques).
La partie initial-scale = 1 est utilisée pour définir le niveau de zoom initial lors du premier chargement de la page par le navigateur.
Conteneurs: le conteneur est utilisé pour envelopper le contenu du site. Il existe deux classes de conteneurs.
- La classe .container fournit un conteneur sensible à largeur fixe.
- La classe .container-fluid fournit un conteneur de largeur complète, couvrant toute la largeur de la fenêtre.
Remarque: Un conteneur ne peut pas être placé à l’intérieur d’un autre conteneur.
Premier exemple de Bootstrap (avec un conteneur sensible à largeur fixe)
<!DOCTYPE html>
<html lang="en">
<head>
<title>Ceci est un exemple Bootstrap</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<h1> Première page web Bootstrap</h1>
<p>Écrivez votre texte ici ..</p>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</body>
</html>