<
Depuis la version < 21.1 >
modifié par Quentin / Zèbre STURER
sur 2021/11/23 16:25
À la version < 22.1 >
modifié par Quentin / Zèbre STURER
sur 2021/11/23 19:56
>
Commentaire de modification : Il n'y a aucun commentaire pour cette version

Résumé

Détails

Icon Propriétés de la Page
Contenu
... ... @@ -4,7 +4,7 @@
4 4  <html>
5 5  <head>
6 6   <meta charset="utf-8">
7 - <link rel="stylesheet" type="text/css" href="menu deroulant.css">
7 + <link rel="stylesheet" type="text/css" href="menu deroulan.css">
8 8   <title>Forbach- 1ère Jeanne D'Arc</title>
9 9  </head>
10 10  
... ... @@ -14,46 +14,44 @@
14 14   <h1>Menu déroulant sticky HTML et CSS</h1>
15 15  
16 16  <!-- bare de menu-->
17 -<nav style="width: 100%; margin: 0 auto; background-color: #11487B ;position: sticky; top: 0px;">
18 -
17 + <nav style="display: inline-block;width: 100%; margin: 0 auto; background-color:#0A4E8C ;position: sticky; top: 0px;border: solid;">
19 19  <!-- Menu Principal-->
20 - <ul style ="list-style-type: none; font.color: white;">
21 - <li class="deroulant"><a href="#"style="color: white; float: left;width: 19%; text-align: center;position: relative;">Branches &ensp;</a>
22 -<!-- Menu Secondaire-->
23 - <!-- 1er Menu-->
24 - <ul class="sous" style="list-style-type: none;">
25 - <li ><a href="#"style="color:orange">Louveteaux</a></li>
26 - <li><a href="#"style="color:blue">Scouts</a></li>
27 - <li><a href="#"style="color:red">Pionniers</a></li>
28 - <li><a href="#"style="color:darkgreen;">Compagnons</a></li>
29 - </ul>
30 - </li>
31 - <!--Second Menu-->
32 - <li class="deroulant"><a href="#"style="color: white;float: left;width: 19%;text-align: center;position: relative;">Photos &ensp;</a>
33 - <ul class="sous" style="list-style-type: none">
34 - <li ><a href="#"style="color:orange">Louveteaux</a></li>
35 - <li><a href="#"style="color:blue">Scouts</a></li>
36 - <li><a href="#"style="color:red">Pionniers</a></li>
37 - <li><a href="#"style="color:darkgreen;">Compagnons</a></li>
38 - </ul>
39 - </li>
19 + <ul style ="list-style-type: none; font.color: white;">
20 + <li class="deroulant"><a href="#"style=" float: left;width: 19%; text-align: center;position: relative;">Branches &ensp;</a>
21 + <!-- Menu Secondaire-->
22 + <!-- 1er Menu-->
23 + <ul class="sous" style="list-style-type: none; width: 250px;top: 40px;left: -10px;">
24 + <li ><a href="#"style="color:orange;text-align: center;">Louveteaux</a></li>
25 + <li><a href="#"style="color:blue">Scouts</a></li>
26 + <li><a href="#"style="color:red">Pionniers</a></li>
27 + <li><a href="#"style="color:darkgreen;">Compagnons</a></li>
28 + </ul>
29 + </li>
30 + <!--Second Menu-->
31 + <li class="deroulant"><a href="#"style=";float: left;width: 19%;text-align: center;position: relative;">Photos &ensp;</a>
32 + <ul class="sous" style="list-style-type: none;width: 250px;top: 40px;left: 233px;">
33 + <li ><a href="#"style="color:orange">Louveteaux</a></li>
34 + <li><a href="#"style="color:blue">Scouts</a></li>
35 + <li><a href="#"style="color:red">Pionniers</a></li>
36 + <li><a href="#"style="color:darkgreen;">Compagnons</a></li>
37 + </ul>
38 + </li>
39 + <!--troisième Menu-->
40 + <li class="deroulant"><a href="#"style="float: left;width: 19%;text-align: center;position: relative;">Archives &ensp;</a>
41 + <ul class="sous" style="list-style-type: none;width: 250px;top: 40px;left: 475px;">
42 + <li><a href="#">CSS display</a></li>
43 + <li><a href="#">CSS position</a></li>
44 + <li><a href="#">CSS float</a></li>
45 + </ul>
46 + </li>
47 + <li><a href="#"style="float: left;width: 19%;text-align: center;position: relative;">Contact</a></li>
48 + <li><a href="#"style="float: left;width: 19%;text-align: center;position: relative;">A propos</a></li>
49 + </ul>
50 + </nav>
40 40  
41 - <!--troisième Menu-->
42 - <li class="deroulant"><a href="#"style="color: white;float: left;width: 19%;text-align: center;position: relative;">Archives &ensp;</a>
43 - <ul class="sous" style="list-style-type: none">
44 - <li><a href="#">CSS display</a></li>
45 - <li><a href="#">CSS position</a></li>
46 - <li><a href="#">CSS float</a></li>
47 - </ul>
48 - </li>
49 - <li><a href="#"style="color: white;float: left;width: 19%;text-align: center;position: relative;">Contact</a></li>
50 - <li><a href="#"style="color: white;float: left;width: 19%;text-align: center;position: relative;">A propos</a></li>
51 - </ul>
52 -</nav>
53 -
54 -<div class="conteneur">
55 - <p>Du contenu sous le menu</p>
56 -</div>
52 + <div class="conteneur">
53 + <p>Du contenu sous le menuefhioeuffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</p>
54 + </div>
57 57  </body>
58 58  </html>
59 59  {{/html}}
This wiki is licensed under a Creative Commons 2.0 license
XWiki 13.10 - Documentation - Conditions