Code source wiki de Code test
Version 22.1 par Quentin / Zèbre STURER le 2021/11/23 19:56
Afficher les derniers auteurs
| author | version | line-number | content |
|---|---|---|---|
| 1 | |||
| 2 | {{html clean="false"}} | ||
| 3 | <!DOCTYPE html> | ||
| 4 | <html> | ||
| 5 | <head> | ||
| 6 | <meta charset="utf-8"> | ||
| 7 | <link rel="stylesheet" type="text/css" href="menu deroulan.css"> | ||
| 8 | <title>Forbach- 1ère Jeanne D'Arc</title> | ||
| 9 | </head> | ||
| 10 | |||
| 11 | <body style=" margin: 0px; padding: 0px; font-family: Avenir, sans-serif;"> | ||
| 12 | |||
| 13 | <!-- Titre--> | ||
| 14 | <h1>Menu déroulant sticky HTML et CSS</h1> | ||
| 15 | |||
| 16 | <!-- bare de menu--> | ||
| 17 | <nav style="display: inline-block;width: 100%; margin: 0 auto; background-color:#0A4E8C ;position: sticky; top: 0px;border: solid;"> | ||
| 18 | <!-- Menu Principal--> | ||
| 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  </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  </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  </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> | ||
| 51 | |||
| 52 | <div class="conteneur"> | ||
| 53 | <p>Du contenu sous le menuefhioeuffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</p> | ||
| 54 | </div> | ||
| 55 | </body> | ||
| 56 | </html> | ||
| 57 | {{/html}} |