non ca ne change absolument rien
voici le code de mes pages anexes ainsi que de ma page index
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Ile de la Réunion</title> <link href="style.css" rel="stylesheet" type="text/css" /> <style type="text/css"> </style> </head> <body class="bodyReunion"><!-- fond pour la page réunion--> <!--<script="JavaScript" src="----.js">--> <div id="principal"> <!-- ----------------------------------------------------------------------------- ici c'est pour les textes de présentations --------------------------------------------------------------------------------------> <div id="entete" class="entete"> Ile de la Réunion </div> <div id="textedepresentationile" class="textedepresentationile"> Présentation de l'île </div> <div id="PiedPage"> </div> <!--------------------------------------------------------------------------------------------------------- Menu et ces calques --------------------------------------------------------------------------------------------------------------> <div id="calque1" class="calque calque1 ecrire" onmouseover="java script:document.getElementById('idbouttonPres').className='boutton bouttonPresentation'; document.getElementById('calque1').style.display='block';" onmouseout="java script:document.getElementById('idbouttonPres').className='boutton bouttonPresentation'; document.getElementById('calque1').style.display='none';"> <p align="center" style="color:aliceblue"><b>Présentation de lentreprise</b> </p> <p align="center" style="color:aliceblue"><b>Mot du directeur</b></p> <p align="center" style="color:aliceblue"><b>Chiffres clés</b> </p> <p align="center" style="color:aliceblue"><b>Contacts</b></p> </div> <div id="calque2" class="calque calque2 ecrire" onmouseover= "document.getElementById('calque2').style.display='block';java script:document.getElementById('idbouttonComp').className='boutton bouttonNosCompetencesHover'" onmouseout="java script:document.getElementById('idbouttonComp').className='boutton bouttonNosCompetences'; document.getElementById('calque2').style.display='none';"> <p align="center" style="color:aliceblue"><b> Compétences</b></p> <p align="center" style="color:aliceblue"><b>Présences territoriales</b></p> </div> <!------------------------------------------------------------------------------------------ Menu ---------------------------------------------------------------------------------------------> <div id="menu"> <div id="idbouttonAcc" class="boutton bouttonAccueil"onmouseover= "java script:document.getElementById('idbouttonAcc').className='boutton bouttonAccueilHover';" onmouseout="java script:document.getElementById('idbouttonAcc').className='boutton bouttonAccueil';"> <a href="index.htm" class="styleA" > Accueil</a> </div> <div id="idbouttonPres" class="boutton bouttonPresentation" onmouseover= "java script:document.getElementById('idbouttonPres').className='boutton bouttonPresentationHover'; document.getElementById('calque1').style.display='block';" onmouseout="java script:document.getElementById('idbouttonPres').className='boutton bouttonPresentation'; document.getElementById('calque1').style.display='none';"> <a href=lien class="styleA"> Présentation </a> </div> <div id="idbouttonComp" class="boutton bouttonNosCompetences" onmouseover= "java script:document.getElementById('idbouttonComp').className='boutton bouttonNosCompetencesHover'; document.getElementById('calque2').style.display='block';" onmouseout="java script:document.getElementById('idbouttonComp').className='boutton bouttonNosCompetences'; document.getElementById('calque2').style.display='none';"> <a href=lien class="styleA"> Nos Compétences </a> </div> <div id="idbouttonServ" class="boutton bouttonNosServices" onmouseover= "java script:document.getElementById('idbouttonServ').className='boutton bouttonNosServicesHover';" onmouseout="java script:document.getElementById('idbouttonServ').className='boutton bouttonNosServices';"> <a href="index.htm" class="styleA" > Nos Services </a> </div> <div id="idbouttonPart" class="boutton bouttonNosPartenaires" onmouseover= "java script:document.getElementById('idbouttonPart').className='boutton bouttonNosPartenairesHover';" onmouseout="java script:document.getElementById('idbouttonPart').className='boutton bouttonNosPartenaires';"> <a href="index.htm" class="styleA" > Nos Partenaires </a> </div> <div id="idbouttonActu" class="boutton bouttonActualite" onmouseover= "java script:document.getElementById('idbouttonActu').className='boutton bouttonActualiteHover';" onmouseout="java script:document.getElementById('idbouttonActu').className='boutton bouttonActualite';"> <a href="index.htm" class="styleA" > Actualité </a> </div> </div> <!--------------------------------------------------------------------------- texte --------------------------------------------------------------------------> <div id="textepage" class="presentationile textepage"> <br>La préfecture est Saint-Denis. <br>La superficie totale de ce territoire est de 2 517 km² mais elle ne cesse de s'agrandir grâce au volcan toujours en activité. <br>En 2005, la population comptait 776.948 personnes soit une densité de 309 hab./km². <br>La monnaie utilisée est l'euro. <br>Fuseau horaire GMT +4</br> <div class="Structure">Notre structure à la Réunion</div> C'est dans cette île que se situe notre siège social. <p>Notre personnel à l'île de la Réunion est composé de:</p> <blockquote> <p>-12 opérateurs chargés d'assistance qui répondent aux téléphones pour porter assistance aux personnes en pannes.</p></blockquote> <p>Ces personnes possèdent une double compétence (opérationnel et comptable).</p> <blockquote>- 4 médecins</p> <p>-1 infirmier</p> <p>-4 informaticiens</p> <p>-3 cadres</p></blockquote> <p>La plateforme d'assistance se fait 24h/24 et 7j/7.</p> <p>Nous disposons d'une salle pour les réserves médicales (valise prête pour les rapatriements, bouteilles d'oxygènes aériennes).Le plateau opérationnel se compose de 15 postes de travail. Le personnel assurant le service de nuit, dispose d'une chambre de garde avec poste de travail.</p> <p>Nous disposons d'une salle technique hébergeant notre système d'information. Cette dernière sécurisée, réfrigérée, et ondulée se compose de plusieurs armoires et serveurs HP (haute disponibilités) et d'une centrale téléphonique informatisée. Avec ce systeme, nous pouvons retracer les appels.</p> Tous le systeme est redondant et permet une haute disponibilité des outils de la société. La téléphonie fait partie intégrante de cette architecture. <p>Cette organisation est basée sur: <blockquote>-une liaison Internet Haut-Débit sécurisée,</p> <p>-une liaison Equant spécialisé pour l'interconnexion des sites distants,</p> <p>-une architecture informatique sur du Oracle - JEE avec <p>-du développement interne,</p> <p>-une téléphonie en VoIP.</blockquote></p> <!---------------------------------------------------------------------------------------------------------- tableau -----------------------------------------------------------------------------------------------------------> <table> <tr> <td><center><img src="image réunion/13.jpg" width="90" height="90" align="absmiddle" background-position="center"/></center></td> <td><center><img src="image réunion/carte_reunion1.jpg" width="90" height="90" align="absmiddle" background-position="center"/></center></td> <td><center><img src="image réunion/cirque_cilaos.jpg" width="90" height="90" align="absmiddle" background-position="center"/></center></td> <td><center><img src="image réunion/fish1.jpg" width="90" height="90" align="absmiddle" background-position="center"/></center></td> <td><center><img src="image réunion/fournaise.jpg" width="90" height="90" align="absmiddle" background-position="center"/></center></td> <td><center><img src="image réunion/REU002-P01.jpg" width="90" height="90" align="absmiddle" background-position="center"/></center></td> </tr> </table> </div> </div> </body> </head> </html>
et ici de ma page index
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><!--la langue du document est précisée ici--> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><!-- l'encodage est spécifié ici avec l'attribut charset--> <title>Page de présentation</title> <link href="style.css" rel="stylesheet" type="text/css" /> <style type="text/css"> </style> </head> <body> <!--<script="JavaScript" src="----.js">--> <div id="principal"> <!------------------------------------------------------------------------------------------------------------- ici c'est pour les textes de présentations -------------------------------------------------------------------------------------------------------> <div id="entete" class="entete"> <p><img src="fond.jpg" style="height:120px; position:absolute; width:230px; left:-80px; top:px"</p> </div> <div id="textedepresentationcompetences" class="textedepresentationcompetences"/> <p>Nos Compétences</p> </div> <div id="textedepresentationpresence" class="textedepresentationpresence"> <p>Nos présences</p> </div> <!--------------------------------------------------------------------------------------------------------- Menu et ces calques --------------------------------------------------------------------------------------------------------------> <div id="calque1" class="calque calque1 ecrire" style="top:102px;" onmouseover="java script:document.getElementById('idbouttonPres').className='boutton bouttonPresentation'; document.getElementById('calque1').style.display='block';" onmouseout="java script:document.getElementById('idbouttonPres').className='boutton bouttonPresentation'; document.getElementById('calque1').style.display='none';"> <p align="center" style="color:aliceblue"><b>Présentation de lentreprise</b> </p> <p align="center" style="color:aliceblue"><b>Mot du directeur</b></p> <p align="center" style="color:aliceblue"><b>Chiffres clés</b> </p> <p align="center" style="color:aliceblue"><b>Contacts</b></p> </div> <div id="calque2" class="calque calque2 ecrire" style="top:102px; "onmouseover= "document.getElementById('calque2').style.display='block';java script:document.getElementById('idbouttonComp').className='boutton bouttonNosCompetencesHover'" onmouseout="java script:document.getElementById('idbouttonComp').className='boutton bouttonNosCompetences'; document.getElementById('calque2').style.display='none';"> <p align="center" style="color:aliceblue"><b> Compétences</b></p> <p align="center" style="color:aliceblue"><b>Présences territoriales</b></p> </div> <!-- -----------------Menu -------------------------------------------------------------------------------------------- --> <div id="menu" style="top:-0px";> <div id="idbouttonAcc" class="boutton bouttonAccueil"onmouseover= "java script:document.getElementById('idbouttonAcc').className='boutton bouttonAccueilHover';" onmouseout="java script:document.getElementById('idbouttonAcc').className='boutton bouttonAccueil';"> <a href="index.htm" class="styleA" > Accueil</a> </div> <div id="idbouttonPres" class="boutton bouttonPresentation" onmouseover= "java script:document.getElementById('idbouttonPres').className='boutton bouttonPresentationHover'; document.getElementById('calque1').style.display='block';" onmouseout="java script:document.getElementById('idbouttonPres').className='boutton bouttonPresentation'; document.getElementById('calque1').style.display='none';"> <a href=lien class="styleA"> Présentation </a> </div> <div id="idbouttonComp" class="boutton bouttonNosCompetences" onmouseover= "java script:document.getElementById('idbouttonComp').className='boutton bouttonNosCompetencesHover'; document.getElementById('calque2').style.display='block';" onmouseout="java script:document.getElementById('idbouttonComp').className='boutton bouttonNosCompetences'; document.getElementById('calque2').style.display='none';"> <a href=lien class="styleA"> Nos Compétences </a> </div> <div id="idbouttonServ" class="boutton bouttonNosServices" onmouseover= "java script:document.getElementById('idbouttonServ').className='boutton bouttonNosServicesHover';" onmouseout="java script:document.getElementById('idbouttonServ').className='boutton bouttonNosServices';"> <a href="index.htm" class="styleA" > Nos Services </a> </div> <div id="idbouttonPart" class="boutton bouttonNosPartenaires" onmouseover= "java script:document.getElementById('idbouttonPart').className='boutton bouttonNosPartenairesHover';" onmouseout="java script:document.getElementById('idbouttonPart').className='boutton bouttonNosPartenaires';"> <a href="index.htm" class="styleA" > Nos Partenaires </a> </div> <div id="idbouttonActu" class="boutton bouttonActualite" onmouseover= "java script:document.getElementById('idbouttonActu').className='boutton bouttonActualiteHover';" onmouseout="java script:document.getElementById('idbouttonActu').className='boutton bouttonActualite';"> <a href="index.htm" class="styleA" > Actualité </a> </div> </div> <!------------------------------------------------------------------------------------------------------------- Création des cadres en bas de page ---------------------------------------------------------------------------------------------------------> <div> <!-- permet de définir le cadre pour mettre les cadres les un sous les autres--> <!-- donne la position de ma fenêtre avec bords arrondis--> <!-- ici on défini les textes qui sont dans les cadres--> <div style="display:none;" id="texte1"> <p align="center">pôle informatique</p> </div> <div style="display:none;" id="texte11"> <p align="center">pôleinfo</p> </div> <div style="display:none;" id="texte2"> <p align="center">pôledegestion</p> </div> <div style="display:none;" id="texte22"> <!-- display none indique aucun affichage--> <p align="center">pôlegestionnews</p> </div> <div style="display:none;" id="texte3"> <p align="center">pôletel</p> </div> <div style="display:none;" id="texte33"> <p align="center">telnews</p> </div> <div style="display:none;" id="texte4"> <p align="center">pôlemedical</p> </div> <div style="display:none;" id="texte44"> <p align="center">medicalnews</p> </div> <div style="display:none;" id="texte5"> <p align="center">Réunion</p> </div> <div style="display:none;" id="texte55"> <p align="center">Réunionnews</p> </div> <div style="display:none;" id="texte6"> <p align="center">Guyane</p> </div> <div style="display:none;" id="texte66"> <p align="center">Guyanenews</p> </div> <div style="display:none;" id="texte7"> <p align="center">Martinique</p> </div> <div style="display:none;" id="texte77"> <p align="center">Martiniquenews</p> </div> <div style="display:none;" id="texte8"> <p align="center">Guadeloupe</p> </div> <div style="display:none;" id="texte88"> <p align="center">Guadeloupenews</p> </div> <script><!--on appel un script qui va modifier les variables dans les cadres--> function surCadre(element,classe,elementContenu,idtexte) { document.getElementById(element).className=classe; document.getElementById(elementContenu).innerHTML=document.getElementById(idtext ).innerHTML;<!--on appel l'id des div et ca les modifie--> } </script> <div id="cadre1" class="cadre cadre1" onmouseover="surCadre('cadre1','cadre cadre1Hover','contenu1','texte11');" onmouseout="surCadre('cadre1','cadre cadre1','contenu1','texte1');"> <!--avec classe, on peut définir les un aprés les autres les classes qu'on met dans le cssla suite de classe name doit être la même que celle de classe--> <div class="hautdroit"></div> <div class="hautgauche"></div> <!--ici on va définir dans la feuille de style css les caractéristiques du hautdroit et hautgauche--> <div class="contenu" id="contenu1"> <!--ici on va définir dans la feuille de style css le contenu de la classe contenu il faut un id unique sinon conflits--> <p align="center">pôle informatique</p> </div> <div class="basdroit"></div> <div class="basgauche"></div> </div> <div id="cadre2" class="cadre cadre2" onmouseover="surCadre('cadre2','cadre cadre2Hover','contenu2','texte22');" onmouseout="surCadre('cadre2','cadre cadre2','contenu2','texte2');"> <div class="hautdroit"></div> <div class="hautgauche"></div> <div class="contenu" id="contenu2"> <p align="center">pôle de gestion</p> </div> <div class="basdroit"></div> <div class="basgauche"></div> </div> <div id="cadre3" class="cadre cadre3" onmouseover="surCadre('cadre3','cadre cadre3Hover','contenu3','texte33');" onmouseout="surCadre('cadre3','cadre cadre3','contenu3','texte3');"> <div class="hautdroit"></div> <div class="hautgauche"></div> <div class="contenu" id="contenu3"> <p align="center">Pôle telephonique</p> </div> <div class="basdroit"></div> <div class="basgauche"></div> </div> <div id="cadre4" class="cadre cadre4" onmouseover="surCadre('cadre4','cadre cadre4Hover','contenu4','texte44');" onmouseout="surCadre('cadre4','cadre cadre4','contenu4','texte4');"> <div class="hautdroit"></div> <div class="hautgauche"></div> <div class="contenu" id="contenu4"> <p align="center">Pôle médical</p> </div> <div class="basdroit"></div> <div class="basgauche"></div> </div> <div id="cadre5" class="cadre cadre5" onmouseover="surCadre('cadre5','cadre cadre5Hover','contenu5','texte55');" onmouseout="surCadre('cadre5','cadre cadre5','contenu5','texte5');"> <div class="hautdroit"></div> <div class="hautgauche"></div> <div class="contenu" id="contenu5"> <p align="center">réunion</p> </div> <div class="basdroit"></div> <div class="basgauche"></div> </div> <div id="cadre6" class="cadre cadre6" onmouseover="surCadre('cadre6','cadre cadre6Hover','contenu6','texte66');" onmouseout="surCadre('cadre6','cadre cadre6','contenu6','texte6');"> <div class="hautdroit"></div> <div class="hautgauche"></div> <div class="contenu" id="contenu5"> <p align="center">Guyane</p> </div> <div class="basdroit"></div> <div class="basgauche"></div> </div> <div id="cadre7" class="cadre cadre7" onmouseover="surCadre('cadre7','cadre cadre7Hover','contenu7','texte77');" onmouseout="surCadre('cadre7','cadre cadre7','contenu7','texte7');"> <div class="hautdroit"></div> <div class="hautgauche"></div> <div class="contenu" id="contenu7"> <p align="center">Martinique</p> </div> <div class="basdroit"></div> <div class="basgauche"></div> </div> <div id="cadre8" class="cadre cadre8" onmouseover="surCadre('cadre8','cadre cadre8Hover','contenu8','texte88');" onmouseout="surCadre('cadre8','cadre cadre8','contenu8','texte8');"> <div class="hautdroit"></div> <div class="hautgauche"></div> <div class="contenu" id="contenu8"> <p align="center">Guadeloupe</p> </div> <div class="basdroit"></div> <div class="basgauche"></div> </div> </div> <div class="cadre cadre9" style="position:relative;border:#000000 1px solid;"> <div class="hautdroit"></div> <div class="hautgauche"></div> <div class="contenu contenuGrandp"> <p>Texte de contenuh</p> </div> <div class="basdroit"></div> <div class="basgauche"></div> </div> </div> </body> </head> </html>