MENU
On construit un menu avec les tags de list html.
On pourra remplacer la couleur de fond par une image faite avec un effete de roll-Over.
Menu Vertical
#navbar {
width:120px;
font-family:Helvetica,Verdana,Courrier;
margin:0px;
padding:0px;
background-color:#FFF;
color:#FFF;
vertical-align:top;
}
#navbar ul {
list-style:none;
margin:0px;
padding:0px;
border:none;
}
#navbar li {
border-bottom :1px solid #FFF;
margin:0px;
}
#navbar li a{
display:block;
width:auto;
text-decoration:none;
padding: 5px 5px 5px 0.5em;
background-color:#023761;
border-bottom :1px solid #FFF;
color:#FFF;
}
#navbar li a:hover{
background-color:#369;
color:#FFF;
border-bottom :1px solid #FF9900;
}
Menu Horizontal
#navbar {
width:100%;
margin:0px;
padding:0px;
background-color:#023761;
color:#FFF;
vertical-align:top;
font-family:Helvetica,Verdana,Courrier;
}
#navbar ul {
list-style:none;
border:none;
margin:0px;
padding:0px;
}
#navbar li {
float: left;
margin:0px;
border-right:1px solid #BBB;
}
#navbar li a{
display:block;
width:120px;
padding: 5px 5px 5px 0.5em;
background-color:#023761;
color:#FFF;
text-decoration:none;
}
#navbar li a:hover{
width:120px;
background-color:#369;
color:#FFF;
border-right:1px solid #99FF00;
}