BasesWeb/FRONTEND/testBootStrap.html

39 lines
1.8 KiB
HTML
Raw Permalink Normal View History

2022-11-24 16:03:59 +01:00
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Mon Premier Bootstrap</title>
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
<!-- JavaScript Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
<link rel="stylesheet" type="text/css" href="StyleCss/StyleTestBootStrap.css" media="all">
</head>
<body>
<section class="container">
<section class="row">
<article class="col-md-10 col-md-offset-1 BordureRouge">col-md-10 col-md-offset-1 : Rouge </article>
</section>
<section class="row">
<article class="col-md-6 col-md-offset-1 BordureBleue">col-md-6 col-md-offset-1 : Bleue </article>
</section>
<section class="row">
<article class="col-md-6 col-md-offset-5 BordureVerte">col-md-6 col-md-offset-5 : Verte </article>
</section>
<section class="row">
<article class="col-md-3 BordureRouge">col-md-3 : Rouge </article>
<article class="col-md-3 BordureOrange">col-md-3 : Orange </article>
<article class="col-md-3 BordureVerte">col-md-3 : Verte </article>
<article class="col-md-3 BordureJaune">col-md-3 : Jaune </article>
</section>
<section class="row">
<article class="col-md-3 BordureBleue">col-md-10 : Bleue </article>
</section>
<section class="row">
<article class="col-md-5 col-md-offset-2 BordureRouge">col-md-5 col-md-offset-2 : Rouge </article>
<article class="col-md-3 col-md-offset-2 BordureVerte">col-md-3 col-md-offset-2 : Verte </article>
</section>
</section>
</body>
</html>