<script type="text/javascript">
function patonglet1() {
  document.getElementById('onglet1').style.display='block';
  document.getElementById('onglet2').style.display='none';
  document.getElementById('onglet3').style.display='none';
  document.getElementById('onglet4').style.display='none';
  document.getElementById('onglet5').style.display='none';
}
 
function patonglet2() {
  document.getElementById('onglet1').style.display='none';
  document.getElementById('onglet2').style.display='block';
  document.getElementById('onglet3').style.display='none';
  document.getElementById('onglet4').style.display='none';
  document.getElementById('onglet5').style.display='none';
}
 
function patonglet3() {
  document.getElementById('onglet1').style.display='none';
  document.getElementById('onglet2').style.display='none';
  document.getElementById('onglet3').style.display='block';
  document.getElementById('onglet4').style.display='none';
  document.getElementById('onglet5').style.display='none';
}

function patonglet4() {
  document.getElementById('onglet1').style.display='none';
  document.getElementById('onglet2').style.display='none';
  document.getElementById('onglet3').style.display='none';
  document.getElementById('onglet4').style.display='block';
  document.getElementById('onglet5').style.display='none';
}

function patonglet5() {
  document.getElementById('onglet1').style.display='none';
  document.getElementById('onglet2').style.display='none';
  document.getElementById('onglet3').style.display='none';
  document.getElementById('onglet4').style.display='none';
  document.getElementById('onglet5').style.display='block';
}
</script>

<table width="100%">
  <tr>
      <td class="onglets">
        <div class="onglet" onmouseover="javascript:patonglet1()"><spanstyle size="20px"><b>A</b>.C.C.U.E.I.L</spanstyle></div>
        <div class="onglet" onmouseover="javascript:patonglet2()"><b>N</b>.O.U.V.E.A.U.T.E.S</div>
        <div class="onglet" onmouseover="javascript:patonglet3()"><b>S</b>.T.A.F.F</div>
        <div class="onglet" onmouseover="javascript:patonglet4()"><b>N</b>.O.S <b>A</b>.M.I.S</div>
        <div class="onglet" onmouseover="javascript:patonglet5()"><b>C</b>.R.E.D.I.T.S</div>
      </td>
     
      <td valign="top" class="contenu_onglets" width="100%">
        <div class="contenu_onglet" id="onglet1">
            CONTENU DE LA PAGE 1
        </div>
       
        <div class="contenu_onglet" id="onglet2"  style="display: none;">
            CONTENU DE LA PAGE 2
        </div>
       
        <div class="contenu_onglet" id="onglet3"  style="display: none;">
            CONTENU DE LA PAGE 3
        </div>
       
        <div class="contenu_onglet" id="onglet4"  style="display: none;">
            CONTENU DE LA PAGE 4
        </div>
       
        <div class="contenu_onglet" id="onglet5"  style="display: none;">
            CONTENU DE LA PAGE 5
        </div>
      </td>
  </tr>
</table>

.onglet {
      width:200px;
      -moz-border-radius:15px;
      -webkit-border-radius:15px;
      border:1px solid #ABABAB;
      background:#000000;
      color:#ABABAB;
      font-variant:normal-caps;
      font-size:16px;
     
      padding:5px;
      margin:2px;
      text-align:center;
  }
 
  .contenu_onglets {
      -moz-border-radius:15px;
      -webkit-border-radius:15px;
      border:1px solid #ABABAB;
      background:#000000;
      color:#ABABAB;
      padding:5px 10px;
      text-align:justify;
  }