miniSITE/zoning1.html at master · Fabgraph/miniSITE · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<!DOCTYPE html>
<html lang="fr">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie-edge">
        <title>miniSITE : Zoning 1</title>
        <link href="css/zoning1.css" rel="stylesheet">
    </head>
    <body>
        <div id="conteneur">
            <header>Haut de page</header>
            <nav>Le menu</nav>

                <section>
                    <!-- 6 div dans cette section -->
                    <div class="a">A<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aut nisi id rerum unde. Beatae provident fugiat, officiis fuga laudantium deleniti! Voluptas numquam assumenda sapiente omnis aspernatur nisi asperiores possimus recusandae.</p></div>
                    <div class="b">B<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aut nisi id rerum unde. Beatae provident fugiat, officiis fuga laudantium deleniti! Voluptas numquam assumenda sapiente omnis aspernatur nisi asperiores possimus recusandae.</p></div>
                    <div class="clear"></div>
                    <div class="c">C<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aut nisi id rerum unde. Beatae provident fugiat, officiis fuga laudantium deleniti! Voluptas numquam assumenda sapiente omnis aspernatur nisi asperiores possimus recusandae.</p></div>
                    <div class="d">D<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aut nisi id rerum unde. Beatae provident fugiat, officiis fuga laudantium deleniti! Voluptas numquam assumenda sapiente omnis aspernatur nisi asperiores possimus recusandae.</p></div>
                    <div class="clear"></div>
                </section>
                <footer>
                    <h2>Le pied de page</h2>
                    <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Porro, odio ex voluptatibus libero eveniet fuga sed quos modi iure, saepe vitae eum minima perspiciatis a consectetur quis tempora ad provident.</p>
                </footer>
        </div>
    </body>
</html>