A COLLER EN HTML EN PERSONNALISANT LES LIENS ET LES ADRESSES DES IMAGES QUI COMPOSENT LE MENU
<style media="all" type="text/css"><!--
.nav {
float:left;
height:35px;
background: url(http://idata.over-blog.com/0/09/36/86/Menu/bg.gif) repeat-x;
position:relative;
font-family:arial, verdana, sans-serif;
font-size:11px;
width:100%;
z-index:100;
margin:0;
padding:0;
}
.nav .table {
display:table;
margin:0 auto;
}
.nav .select,
.nav .current {
margin:0;
padding:0;
list-style:none;
display:table-cell;
white-space:nowrap;
}
.nav li {
margin:0;
padding:0;
height:auto;
float:left;
}
.nav .select a {
display:block;
height:35px;
float:left;
font-weight:bold;
background: url(http://idata.over-blog.com/0/09/36/86/Menu/bg.gif);
padding:0 30px 0 30px;
text-decoration:none;
line-height:35px;
white-space:nowrap;
color:#dfdfdf;
}
.nav .select a:hover,
.nav .select li:hover a {
background: url(http://idata.over-blog.com/0/09/36/86/Menu/hover.gif);
padding:0 30px 0 30px;
cursor:pointer;
color:#2b3238;
}
.nav .select a b{
font-weight:bold;
}
.nav .select a:hover b,
.nav .select li:hover a b {
display:block;
float:left;
padding:0 30px 0 15px;
background:url(http://idata.over-blog.com/0/09/36/86/Menu/hover.gif) right top;
cursor:pointer;
}
.nav .select_sub {
display:none;
}
/* IE6 only */
.nav table {
border-collapse:collapse;
margin:-1px;
font-size:1em;
width:0;
height:0;
}
.nav .sub {
display:table;
margin:0 auto;
padding:0;
list-style:none;
}
.nav .sub_active .current_sub a,
.nav .sub_active a:hover {
background:transparent;
color:#2b3238;
}
.nav .select :hover .select_sub,
.nav .current .show {
display:block;
position:absolute;
width:100%;
top:35px;
background:url(http://idata.over-blog.com/0/09/36/86/Menu/back.gif);
padding:0;
z-index:100;
left:0;
text-align:center;
}
.nav .current .show {
z-index:10;
}
.nav .select :hover .sub li a,
.nav .current .show .sub li a {
display:block;
float:left;
background:transparent;
padding:0 10px 0 10px;
margin:0;
white-space:nowrap;
border:0;
color:#000000;
}
.nav .current .sub li.sub_show a {
color:#2b3238;
cursor:default;
}
.nav .select .sub li a {
font-weight:normal;
}
.nav .select :hover .sub li a:hover,
.nav .current .sub li a:hover {
visibility:visible;
color:#909090;
}
--></style>
<div class="nav">
<div class="table">
<ul class="select">
<li>
<a href="http://www.trezeguet-david.com" target="_self"><strong>Accueil</strong></a>
</li>
</ul>
<ul class="select">
<li>
<a href="http://www.trezeguet-david.com" target="_self"><strong>Biographie</strong></a>
<div class="select_sub">
<ul class="sub">
<li>
<a href="http://www.trezeguet-david.com/categorie-167892.html" target="_self">Biographie</a>
</li>
<li>
<a href="http://www.trezeguet-david.com/categorie-167913.html" target="_self">Palmares</a>
</li>
</ul>
</div>
</li>
</ul>
<ul class="select">
<li>
<a href="http://www.trezeguet-david.com" target="_self"><strong>Juventus</strong></a>
<div class="select_sub">
<ul class="sub">
<li>
<a href="http://www.trezeguet-david.com/categorie-167894.html" target="_self">Championnat</a>
</li>
<li>
<a href="http://www.trezeguet-david.com/categorie-285504.html" target="_self">Ligue des Champions / Europa League</a>
</li>
<li>
<a href="http://www.trezeguet-david.com/categorie-167901.html" target="_self">Interview</a>
</li>
</ul>
</div>
</li>
</ul>
<ul class="select">
<li>
<a href="http://www.trezeguet-david.com" target="_self"><strong>Hércules</strong></a>
<div class="select_sub">
<ul class="sub">
<li>
<a href="http://www.trezeguet-david.com/categorie-11579525.html" target="_self">Championnat</a>
</li>
<li>
<a href="http://www.trezeguet-david.com/categorie-11580602.html" target="_self">Interview</a>
</li>
</ul>
</div>
</li>
</ul>
<ul class="select">
<li>
<a href="http://www.trezeguet-david.com/categorie-167895.html" target="_self"><strong>France</strong></a>
</li>
</ul>
</div>
</div>
