-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathpage-web.html
62 lines (56 loc) · 2.89 KB
/
page-web.html
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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<!DOCTYPE html>
<html>
<head>
<title>Page Web 1</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="style-base.css">
<link rel="stylesheet" type="text/css" href="grille-simple.css">
</head>
<body>
<main class="enveloppe grille">
<header class="entete">
<h1>Grille Simple</h1>
<p>Description de la page</p>
</header>
<nav class="navigation">
<ul class="menu-principal">
<li><a href="#">Accueil</a></li>
<li><a href="#">Nous connaître</a></li>
<li><a href="#">Nos articles</a></li>
<li><a href="#">Liens</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
<div class="contenu-complet">
<article class="contenu">
<h1>Mon article</h1>
<em>Cras mattis consectetur purus sit amet fermentum. Cras mattis consectetur purus sit amet fermentum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Sed posuere consectetur est at lobortis.</em>
<h2>Mon sous-titre</h2>
<p>Donec ullamcorper nulla non metus auctor fringilla. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Nullam id dolor id nibh ultricies vehicula ut id elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec id elit non mi porta gravida at eget metus.</p>
<h2>Autre sous-titre</h2>
<p>Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.Donec sed odio dui. Nullam id dolor id nibh ultricies vehicula ut id elit. Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
</article>
<aside class="barre-laterale">
<section class="widget">
<h3>Plan du site</h3>
<ul class="menu-principal">
<li><a href="#">Accueil</a></li>
<li><a href="#">Nous connaître</a></li>
<li><a href="#">Nos articles</a></li>
<li><a href="#">Liens</a></li>
<li><a href="#">Contact</a></li>
</ul>
</section>
<section class="widget">
<h3>Nous connaître</h3>
<p>Donec sed odio dui. Donec id elit non mi porta gravida at eget metus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Curabitur blandit tempus porttitor. Maecenas faucibus mollis interdum. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
</section>
</aside>
</div>
<footer class="pied-page">
<p>Copyright © 2017 | <a href="#">Mentions légales</a></p>
</footer>
</main>
</body>
</html>