commit
62e9f912e3
Binary file not shown.
@ -0,0 +1,156 @@
|
|||||||
|
/*Reset CSS*/
|
||||||
|
*{
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
font-family: Avenir, sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav{
|
||||||
|
width: 100%;
|
||||||
|
margin: 0px auto 40px auto;
|
||||||
|
background-color: gray;
|
||||||
|
position: fixed;
|
||||||
|
top: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav ul{
|
||||||
|
list-style-type: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav li{
|
||||||
|
float: left;
|
||||||
|
width: 25%;/*100% divisé par le nombre d'éléments de menu*/
|
||||||
|
text-align: center;/*Centre le texte dans les éléments de menu*/
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*Evite que le menu n'ait une hauteur nulle*/
|
||||||
|
nav ul::after{
|
||||||
|
content: "";
|
||||||
|
display: table;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav a{
|
||||||
|
display: block; /*Toute la surface sera cliquable*/
|
||||||
|
text-decoration: none;
|
||||||
|
color: black;
|
||||||
|
border-bottom: 3px solid transparent;/*Evite le décalage des éléments sous le menu à cause de la bordure en :hover*/
|
||||||
|
padding: 10px 0px;/*Agrandit le menu et espace la bordure du texte*/
|
||||||
|
font-family: 'Gemunu Libre', sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav a:hover{
|
||||||
|
color: #16f6a5;
|
||||||
|
border-bottom: 5px solid red;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sous{
|
||||||
|
display: none;
|
||||||
|
box-shadow: 0px 1px 2px #CCC;
|
||||||
|
background-color: white;
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 1000;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav > ul li:hover .sous{
|
||||||
|
display: block;
|
||||||
|
background: linear-gradient(gray,white);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sous li{
|
||||||
|
float: none;
|
||||||
|
width: 100%;
|
||||||
|
text-align: left;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sous a{
|
||||||
|
padding: 10px;
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.deroulant > a::after{
|
||||||
|
content:" ▼";
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sous a:hover{
|
||||||
|
border-bottom: none;
|
||||||
|
background-color: gray;
|
||||||
|
border-bottom: 4px solid #16f6a5;
|
||||||
|
color: #16f6a5;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.conteneur{
|
||||||
|
margin: 0px 20px;
|
||||||
|
height: 1500px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.entete{
|
||||||
|
height:400px;
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#titre{
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
body{
|
||||||
|
background-color: #c1c8c9;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer
|
||||||
|
{
|
||||||
|
background-color: gray;
|
||||||
|
width: 100%;
|
||||||
|
height: 40px;
|
||||||
|
bottom:0;
|
||||||
|
position: sticky;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
h2{
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
table{
|
||||||
|
width: 100%;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
table,
|
||||||
|
td {
|
||||||
|
border: 1px solid #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
td ul{
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
thead,
|
||||||
|
tfoot {
|
||||||
|
background-color: #333;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#ecologie{
|
||||||
|
background: #9ACD32;
|
||||||
|
border: 1px solid black;
|
||||||
|
padding:1em 1em 1em 5em;
|
||||||
|
border-top:2px solid #aeb8de;
|
||||||
|
border-bottom:2px solid #aeb8de;
|
||||||
|
}
|
||||||
|
|
||||||
|
#acteco{
|
||||||
|
background: #fefee2;
|
||||||
|
border: 1px solid black;
|
||||||
|
padding:1em 1em 1em 5em;
|
||||||
|
border-top:2px solid #aeb8de;
|
||||||
|
border-bottom:2px solid #aeb8de;
|
||||||
|
}
|
Loading…
Reference in new issue