Menu simple à transformer en onglets CSS

Résolu/Fermé
cathywawa Messages postés 25 Date d'inscription mercredi 2 avril 2008 Statut Membre Dernière intervention 6 janvier 2009 - 16 oct. 2008 à 22:18
cathywawa Messages postés 25 Date d'inscription mercredi 2 avril 2008 Statut Membre Dernière intervention 6 janvier 2009 - 28 oct. 2008 à 17:06
Bonjour,

Je crée un iste avec dreamweaver (CS3).
J'ai créé un menu simple avec des boutons pour chaque rubrique mais je voudrais le transformer en menu à onglets.

Je ne sais pas comment adapter les fichiers donnés par ce site "http://normandlamoureux.com/cours/css/#introduction", en fonction de mon site "http://www.cwsecretariat.fr".

Je vous remercie pour votre aide qui me sera d'un grand secours.

A voir également:

5 réponses

RAD ZONE Messages postés 5224 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 22 mars 2024 1 353
17 oct. 2008 à 00:00
SALUT

J en ai fais un vite fais , tu l adapte a tes liens !! j ai laisse un bout de css embarque pour que en cas d utilisation d includ tu sache quel css pour que le bouton de la page ouverte reste clique !!

le dossier

menu_tab_pour_cathywawa

sur un de mes Sites

tout les fichiers sont dans le .rar

RAD
2
cathywawa Messages postés 25 Date d'inscription mercredi 2 avril 2008 Statut Membre Dernière intervention 6 janvier 2009 14
28 oct. 2008 à 17:06
Bonjour,

Alors, j'ai personnalisé le menu de RAD ZONE et ça a l'air d'aller. merci beaucoup à RAD ZONE.

Par contre, j'ai un autre souci, mais je vais ouvrir un autre post : c'est comment faire pour que mes pages en .php s'affichent quand les visiteurs cliquent sur l'onglet correspondant ?
0
cathywawa Messages postés 25 Date d'inscription mercredi 2 avril 2008 Statut Membre Dernière intervention 6 janvier 2009 14
17 oct. 2008 à 13:44
Bonjour RAD ZONE et merci beaucoup pour ton aide !

Je suis désolée mais je ne sais pas où inclure le code du menu que tu m'as fait au niveau de ma page index.php et quelle partie je peux retirer de mon code actuel. Merci pour ton aide

Voici l'actuel (sans une grosse partie des balises meta pour ne pas encombrer !) :

...
<meta name="Date-Creation-yyyymmdd" content="010608">
<meta name="Date-Revision-yyyymmdd" content="010608">
<style type="text/css">
<!--
body {
background-color: #E2E2E2;
}
#Layer1 {
position:absolute;
width:39px;
height:40px;
z-index:1;
left: 161px;
top: 549px;
}
#Layer2 {
position:absolute;
width:44px;
height:40px;
z-index:2;
left: 164px;
top: 325px;
}
#Layer3 {
position:absolute;
width:40px;
height:35px;
z-index:3;
left: 162px;
top: 605px;
}
#Layer4 {
position:absolute;
width:200px;
height:115px;
z-index:4;
}
#Layer5 {
position:absolute;
width:200px;
height:115px;
z-index:1;
}
#Layer6 {
position:absolute;
width:60px;
height:46px;
z-index:4;
left: 157px;
top: 382px;
}
#Layer7 {
position:absolute;
width:200px;
height:115px;
z-index:5;
}
#Layer8 {
position:absolute;
width:47px;
height:43px;
z-index:5;
left: 159px;
top: 256px;
}
#Layer9 {
position:absolute;
width:37px;
height:43px;
z-index:6;
left: 162px;
top: 494px;
}
#Layer10 {
position:absolute;
width:45px;
height:40px;
z-index:6;
left: 165px;
top: 499px;
}
#Layer11 {
position:absolute;
width:49px;
height:43px;
z-index:7;
left: 163px;
top: 443px;
}
.Style4 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
.Style25 {font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 12px; }
-->
</style>
<script src="../../../Scripts/AC_RunActiveContent.js" type="text/javascript"></script>

</head>

<body>
<table width="800" height="200" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>
<td width="696" height="200"><img src="../Nouvelles images index/banniere2.jpg" width="800" height="200" /></td>
</tr>
</table>
<table width="800" height="236" border="2" align="center" cellpadding="0" cellspacing="0" bordercolor="#663366" bgcolor="#FFFFFF">
<tr>
<td width="111" height="52" bgcolor="#FFFFFF"><div align="center"><a href="index.php?page=accueil"></a><a href="index.php?page=accueil"><img src="../Nouvelles images index/button42486551.jpg" width="105" height="45" border="0" /></a></div></td>
<td width="111" bgcolor="#FFFFFF"><div align="center"><a href="index.php?page=avantages"><img src="../Nouvelles images index/button16569213.jpg" width="105" height="45" border="0" /></a></div></td>
<td width="111" bgcolor="#FFFFFF"><div align="center"><a href="index.php?page=methode"><img src="../Nouvelles images index/button77669968.jpg" width="105" height="45" border="0" /></a></div></td>
<td width="111" bgcolor="#FFFFFF"><div align="center"><a href="index.php?page=services"><img src="../Nouvelles images index/button62296464.jpg" width="105" height="45" border="0" align="middle" /></a>
</div></td>
<td width="111" bgcolor="#FFFFFF"><div align="center"><a href="index.php?page=references"><img src="../Nouvelles images index/button30065628.jpg" width="105" height="45" border="0" /></a></div></td>
<td width="111" bgcolor="#FFFFFF"><div align="center"><a href="index.php?page=contact"><img src="../Nouvelles images index/button92709460.jpg" width="105" height="45" border="0" /></a></div></td>
<td width="116" bgcolor="#FFFFFF"><div align="center"><a href="index.php?page=liens"><img src="../Nouvelles images index/button10542160.jpg" width="105" height="45" border="0" /></a></div></td>
</tr>
<tr>
<td colspan="7" bgcolor="#FFFFFF"><table width="100%" bgcolor="#FFFFFF">
<tr>
<td bordercolor="#FFFFFF"><div align="center">
<p align="left">
<?php
If ($page == '' or $page == "index") { $page = "accueil"; }
$page = $page.".php";
If (!is_file($page)) { $page = "erreur.php"; }
clearstatcache();
include($page);
?>
<br />
</p>
</div></td>
</tr>
</table></td>
</tr>
</table>

<table width="800" height="198" border="3" align="center" bordercolor="#054169" bgcolor="#FFFFFF">
<tr bordercolor="#663366">
<td width="246" height="188" nowrap="nowrap" bordercolor="#FFFFFF" bgcolor="#FFFFFF"><p><span class="Style4"><img src="../logoc.jpg" width="203" height="91" /><br />
</span><span class="Style25">24 voie des Sarrazins<br />
51250 SERMAIZE-LES-BAINS<br />
FRANCE<br />
<br />
Tél. : + 33 (0)6.67.16.24.26<br />
E-mail :<a href="mailto:admin@cwsecretariat.fr">admin@cwsecretariat.fr</a></span></p> </td>
<td width="534" height="188" bordercolor="#FFFFFF" bgcolor="#FFFFFF"><p align="left" class="Style25"><strong>Pour ajouter cette page à vos FAVORIS, tapez CTRL + D</strong></p>
<p align="left" class="Style25"><a href="index.php?page=plandusite">Plan du site</a> - <a href="index.php?page=apropos">A propos</a> - <a href="index.php?page=protectionvieprivee">Protection de la vie privée</a><br />
Menu : <a href="index.php?page=accueil">Accueil</a> - <a href="index.php?page=avantages">Avantages</a> - <a href="index.php?page=methode">Méthode et garanties</a> - <a href="index.php?page=services">Services et Tarifs</a> - <a href="index.php?page=references">Références</a> - <a href="index.php?page=contact">Contact</a><br />
<a href="javascript:window.print()">Imprimer cette page</a> - <a href="Envoipage.php">Recommander ce site à un(e) ami(e) ou collègue</a><br />
<br />
<br />
<br />
© 2008. Tous droits réservés.<br />
<u><a href="http://www.cwsecretariat.fr">http://www.cwsecretariat.fr</a><br />
</u></p></td>
</tr>
</table>

</body>
</html>
-1
RAD ZONE Messages postés 5224 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 22 mars 2024 1 353
17 oct. 2008 à 14:00
a la place de ca
 <tr>
        <td width="111" height="52" bgcolor="#FFFFFF">
          <div align="center">
            <a href="index.php?page=accueil"></a>
            <a href="index.php?page=accueil">
              <img src="../Nouvelles images index/button42486551.jpg" width="105" height="45" border="0" /></a>
          </div></td>
        <td width="111" bgcolor="#FFFFFF">
          <div align="center">
            <a href="index.php?page=avantages">
              <img src="../Nouvelles images index/button16569213.jpg" width="105" height="45" border="0" /></a>
          </div></td>
        <td width="111" bgcolor="#FFFFFF">
          <div align="center">
            <a href="index.php?page=methode">
              <img src="../Nouvelles images index/button77669968.jpg" width="105" height="45" border="0" /></a>
          </div></td>
        <td width="111" bgcolor="#FFFFFF">
          <div align="center">
            <a href="index.php?page=services">
              <img src="../Nouvelles images index/button62296464.jpg" width="105" height="45" border="0" align="middle" /></a>
          </div></td>
        <td width="111" bgcolor="#FFFFFF">
          <div align="center">
            <a href="index.php?page=references">
              <img src="../Nouvelles images index/button30065628.jpg" width="105" height="45" border="0" /></a>
          </div></td>
        <td width="111" bgcolor="#FFFFFF">
          <div align="center">
            <a href="index.php?page=contact">
              <img src="../Nouvelles images index/button92709460.jpg" width="105" height="45" border="0" /></a>
          </div></td>
        <td width="116" bgcolor="#FFFFFF">
          <div align="center">
            <a href="index.php?page=liens">
              <img src="../Nouvelles images index/button10542160.jpg" width="105" height="45" border="0" /></a>
          </div></td>
      </tr>


sur chaques page ou en includ !!

RAD
-1

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
cathywawa Messages postés 25 Date d'inscription mercredi 2 avril 2008 Statut Membre Dernière intervention 6 janvier 2009 14
19 oct. 2008 à 12:43
salut !


Merci. J'ai donc fait le changement mais, seulement sur ma page index.php, étant donné que les autres pages sont appelées à partir de celle-ci.

Voici ce que ça donne : http://www.cwsecretariat.fr/index3.php

J'ai mis les liens seulement vers les pages "accueil" et "avantages".

Comment faire pour que l'onglet de la page sur laquelle je me trouve soit d'une autre couleur ? Ca reste pareil comme quand je suis sur "accueil".

PS : je ne sais pas ce que veut dire "mettre en includ".

Merci pour ta réponse
-1