Corrigé partiel séance 2
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/bootstrap.min.css">
<title>Document</title>
<script src="js/bootstrap.min.js" defer></script>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container-fluid">
<a class="navbar-brand" href="#">Lotus Elise</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse d-flex" id="navbarNavDropdown">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Acceuil</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Motirisation</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Finition</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<div class="row">
<div class="col-8">
<div class="row">
<div class="col-12 p-2 m-2">
<p>La Lotus Elise est une petite voiture de sport du constructeur automobile britannique Lotus, disposant d'une carrosserie cabriolet deux places avec arceau. Lotus commercialise également des versions proches, équipées d'un toit, nommées Lotus Exige.</p>
<p>L'Elise marque le renouveau de Lotus dans la catégorie des petites voitures de sport des années 1990. Elle constitue un retour aux sources après l'échec de l'Elan M100 traction avant. L'Elise est une sportive légère équipée, comme l'Europa des années 1960-1970, d'un moteur central avec transmission arrière. Bien que son architecture soit différente, on considère souvent l'Elise comme la remplaçante moderne de l'Elan des années 1960, car elle en reprend certains principes, notamment la légèreté.</p>
<p>La production de l'Elise est stoppée en décembre 2021 après 26 années et 35 124 exemplaires commercialisés1.</p>
</div>
<div class="col-12">
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link active" id="btn-voiture1" data-bs-toggle="tab" data-bs-target="#voiture1" type="button" role="tab" aria-controls="voiture1" aria-selected="true">Voiture 1</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" id="btn-voiture2" data-bs-toggle="tab" data-bs-target="#voiture2" type="button" role="tab" aria-controls="voiture2" aria-selected="false">voiture2</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" id="btn-voiture3" data-bs-toggle="tab" data-bs-target="#voiture3" type="button" role="tab" aria-controls="voiture3" aria-selected="false">voiture3</button>
</li>
</ul>
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="voiture1" role="tabpanel" aria-labelledby="voiture1">
<table class="table table-striped">
<thead>
<tr>
<th>Cylindrée</th>
<th>Puissance</th>
<th>Couple</th>
</tr>
</thead>
<tbody>
<tr>
<td>1598</td>
<td>120</td>
<td>250</td>
</tr>
<tr>
<td>1598</td>
<td>120</td>
<td>250</td>
</tr>
<tr>
<td>1598</td>
<td>120</td>
<td>250</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="voiture2" role="tabpanel" aria-labelledby="voiture2">
Voiture 2
</div>
<div class="tab-pane fade" id="voiture3" role="tabpanel" aria-labelledby="voiture3">
Voiture 3
</div>
</div>
</div>
</div>
</div>
<div class="col-4">
photo
zone de recherche
<div class="card" style="width: 18rem;">
<div class="card-header bg-success">
Featured
</div>
<ul class="list-group list-group-flush">
<li class="list-group-item">An item</li>
<li class="list-group-item">A second item</li>
<li class="list-group-item">A third item</li>
</ul>
</div>
</div>
</div>
</body>
</html>Last updated