Un fond pour un tableau

[emc2]

bonjour,
Je souhaiterais rajouter une image de fond dans un tableau possédant des onglets et affichant un texte différent pour chaque onglet. Mon tableau est construit de la manière suivante:

Dans le CSS:

Code:

h1.onglet, h1.ongletSelect {
  display:block;
  max-width:140px;
  float: left;
  margin: 2px 0px;
  cursor: pointer;}
 
.clear {clear: both; visibility:hidden;}
 
 
#ongletsEMC, #BlocContenus {
  width: 615px; height: 20px; margin: 0 auto;
  background-color: #f2f2f2;border-radius: 7px;}
#BlocContenus {
  overflow: auto; overflow-y: auto; overflow-x: hidden;height: 130px;
  margin-top: 2px;border: 5px solid #273d11;padding: 6px;}
 
.contenu {color: #000000;font-family: Verdana,Arial,Helvetica,sans-serif;}
 
.contenu p {
  margin: 0px;font-family: Verdana,Arial,Helvetica,sans-serif;
  text-align: justify;}
 
.contenu a {color: rgb(232, 30, 30);text-decoration:none;}
#cred_l {font:11px Times New Roman;color: #000000;}
 

Le code javascript:

Code:

function changeOnglet(_this){
              var getOnglets    = document.getElementById('ongletsEMC').getElementsByTagName('h1');
              for(var i = 0; i  < getOnglets.length; i++){
                  if(getOnglets[i].id){
                    if(getOnglets[i].id == _this.id){
                        getOnglets[i].className = 'ongletSelect';
                        document.getElementById('c' + _this.id).style.display          = 'block';
                    }
                    else{
                        getOnglets[i].className = 'onglet';
                        document.getElementById('c' + getOnglets[i].id).style.display    = 'none';
                    }
                  }
              }   
          }

et dans l'emplacement description du forum, ceci:

Code:

<div id="ongletsEMC">
   
   <h1 id="o_1" class="ongletSelect" onclick="changeOnglet(this);">
       <img src="http://i57.servimg.com/u/f57/17/19/42/30/presen10.png" alt="onglet 1" />
   </h1>
   
   <h1 id="o_2" class="onglet" onclick="changeOnglet(this);">
       <img src="http://i57.servimg.com/u/f57/17/19/42/30/citoye10.png" alt="onglet 2" />
   </h1>
   
   <h1 id="o_3" class="onglet" onclick="changeOnglet(this);">
       <img src="http://i57.servimg.com/u/f57/17/19/42/30/electi10.png" alt="onglet 3" />
   </h1>
   
   <h1 id="o_4" class="onglet" onclick="changeOnglet(this);">
       <img src="http://i57.servimg.com/u/f57/17/19/42/30/creer_10.png" alt="onglet 4" />
   </h1>
   
   <h1 id="o_5" class="onglet" onclick="changeOnglet(this);">
       <img src="http://i57.servimg.com/u/f57/17/19/42/30/legisl10.png" alt="onglet 5" />
   </h1>
   
   <h1 id="o_6" class="onglet" onclick="changeOnglet(this);">
       <img src="http://i57.servimg.com/u/f57/17/19/42/30/la_pre10.png" alt="onglet 6" />
   </h1>
   
   <h1 id="o_7" class="ongletSelect" onclick="changeOnglet(this);">
       <img src="http://i57.servimg.com/u/f57/17/19/42/30/la_jus10.png" alt="onglet 7" />
   </h1>
   
   <h1 id="o_8" class="ongletSelect" onclick="changeOnglet(this);">
       <img src="http://i57.servimg.com/u/f57/17/19/42/30/facebo10.png" alt="onglet 8" />
   </h1>
   
   <hr class="clear" />
</div>
<!--                                                                                                            FIN ONGLETS                                                                                                            -->
<!--                                                                                                            DÉBUT CONTENUS                                                                                                            -->
<div id="BlocContenus">
   
   <!--                                                                                                            DÉBUT CONTENU 1                                                                                                            -->
   <div id="co_1" class="contenu">
      
      <p>
          <span style="color: #273d11; font-size: 13px;"><strong>Bonjour {USER&amp;#8288;NAME}, bienvenu(e) sur l'espace de Polis&Sophia. Ce forum est à la disposition des membres voulant débattre de sujets d'actualité et de politique. Il est possible de participer au RPG permettant de devenir Président du Forum en passant par des élections, des campagnes électorales. D'autres fonctions sont à conquérir comme ministre, chef de parti, journaliste, etc... Sauras-tu convaincre, débattre ? C'est à toi de jouer... </strong></span>
      </p>
      
   </div>
   
   <!--                                                                                                            FIN CONTENU 1                                                                                                            -->
   <!--                                                                                                            DÉBUT CONTENU 2                                                                                                            -->
   <div id="co_2" class="contenu" style="display: none;">
      
      <p>
          <span style="color: #273d11; font-size: 13px;"><strong>La citoyenneté c'est l'acquisition de droits, mais aussi de devoirs. Pour l'obtenir, il faudra poster 100 messages, être inscrit(e) depuis au moins quinze jours et avoir obtenu l'acceptation de sa citoyenneté en déposant sa demande à la préfecture.</strong></span><br />
      </p><br />
      <center>
          <a href="http://polisetsophia.forumactif.org/f41-demande-de-citoyennete"><img ;border="0" src="http://i57.servimg.com/u/f57/17/19/42/30/demand10.png" /></a>
      </center>
      
   </div>
   
   <!--                                                                                                            FIN CONTENU 2                                                                                                            -->
   <!--                                                                                                            DÉBUT CONTENU 3                                                                                                            -->
   <div id="co_3" class="contenu" style="display: none;">
      
      <p>
          <span style="color: #273d11; font-size: 13px;"><strong>Pour participer à une élection, il faut être citoyen. Avoir posté au moins 20 messages durant les dix jours précédant l'ouverture du premier tour de scrutin, vérifier que l'on est bien dans la liste des inscrits et le signaler si ce n'est pas le cas. Aucune réclamation ne pourra être portée une fois le scrutin ouvert.</strong></span><br />
      </p><br />
      <center>
          <a href="http://polisetsophia.forumactif.org/t926-liste-des-electeurs-inscrits"><img ;border="0" src="http://i57.servimg.com/u/f57/17/19/42/30/verifi10.png" /></a>
      </center>
      
   </div>
   
   <!--                                                                                                            FIN CONTENU 3                                                                                                            -->
   <!--                                                                                                            DÉBUT CONTENU 4                                                                                                            -->
   <div id="co_4" class="contenu" style="display: none;">
      
      <p>
          <span style="color: #273d11; font-size: 13px;"><strong>Tu peux créer un parti, un groupe de pression ou tout autre association de personnes portant une même idéologie. Il faut le faire savoir en préfecture et obtenir l'adhésion de deux autres membres. Publier les statuts, un logo et une couleur. L'acceptation sera faite par le Président du forum. En cas de refus, celui-ci devra être motivé.</strong></span>
      </p>
      
      <center>
          <a href="http://polisetsophia.forumactif.org/f42-creation-de-partis-politiques"><img ;border="0" src="http://i57.servimg.com/u/f57/17/19/42/30/creer_11.png" /></a>
      </center>
      
   </div>
   
   <!--                                                                                                            FIN CONTENU 4                                                                                                            -->
   <!--                                                                                                            DÉBUT CONTENU 5                                                                                                            -->
   <div id="co_5" class="contenu" style="display: none;">
      
      <p>
          <span style="color: #273d11; font-size: 13px;"><strong>La législation est l'ensemble des lois que les institutions du forum ont voté. Aujourd'hui la constitution prévoit que ces lois sont débattues au sein des différents partis et que c'est aux chefs de chaque parti, après débat, de voter les propositions de loi. Un chef de parti ou le gouvernement peuvent proposer un texte de loi. Ce qui donne aux chefs de parti le pouvoir législatif.</strong></span>
      </p>
      
   </div>
   
   <!--                                                                                                            FIN CONTENU 5                                                                                                            -->
   <!--                                                                                                            DÉBUT CONTENU 6                                                                                                            -->
   <div id="co_6" class="contenu" style="display: none;">
      
      <p>
          <span style="color: #273d11; font-size: 13px;"><strong>La presse de Polis&Sophia est libre. Il est possible de créer un journal dont la ligne éditoriale reste dans le cadre de la législation française. La réglementation est assurée par le collège administratif. Un titre peut être remisé aux archives s'il devient inactif. Il peut-être interdit provisoirement ou définitivement par le même collège administratif.</strong></span>
      </p>
      
      <center>
          <a href="http://polisetsophia.forumactif.org/f53-ajps"><img ;border="0" src="http://i57.servimg.com/u/f57/17/19/42/30/craer_11.png" /></a>
      </center>
      
   </div>
   
   <!--                                                                                                            FIN CONTENU 6                                                                                                            -->
   <!--                                                                                                            DÉBUT CONTENU 7                                                                                                            -->
   <div id="co_7" class="contenu" style="display: none;">
      
      <p>
          <span style="color: #273d11; font-size: 13px;"><strong>La justice sur Polis&Sophia est un jeu RPG permettant de revisiter les grands procès du passé et d'en jouer un rôle afin de défendre, juger ou accuser un personnage de l'Histoire. Chaque procès est choisi par l'ensemble des membres du forum lors d'un référendum.<br />La justice du Forum est assurée par les modérateurs et les administrateurs avec un règlement propre. Elle ne passe pas par un procès RPG</strong> </span>
      </p>
      
   </div>
   
   <!--                                                                                                            FIN CONTENU 7                                                                                                            -->
   <!--                                                                                                            DÉBUT CONTENU 8                                                                                                          -->
   <div id="co_8" class="contenu" style="display: none;">
      
      <p>
         
      </p>
      
      <center>
          <a href="https://www.facebook.com/pages/Polis-et-Sophia/675069769219052"><img src="http://i57.servimg.com/u/f57/17/19/42/30/facebo11.png" /></a>
      </center>
      
      <p>
         
      </p>
      
   </div>
   
   <!--                                                                                                            FIN CONTENU 8                                                                                                            -->
   <!--                                                                                                            FIN CONTENUS                                                                                                            -->
</div>

L'idéal serait d'avoir un fond de tableau différent pour chaque texte que l'on a sélectionner par un onglet.

En spoiler l'apparence du tableau. C'est le fond blanc que je souhaietrais remplacer par une image. Merci par avance.

apparence du tableau:

[Self]

Bonjour,

Comme chaque container a un ID il suffit pour chacun d'entre eux d'ajouter un peu de CSS :

Code:

#co_1{
   background: url('URLDELIMAGE');
}
#co_2{
   background: url('URLDELIMAGE');
}
#co_3{
   background: url('URLDELIMAGE');
}
#co_4{
   background: url('URLDELIMAGE');
}
#co_5{
   background: url('URLDELIMAGE');
}
#co_6{
   background: url('URLDELIMAGE');
}
#co_7{
   background: url('URLDELIMAGE');
}

en remplaçant URLDELIMAGE par le lien de l'image que l'on veut en fond !

[emc2]

Merci beaucoup, ça fonctionne parfaitement. Il ne me reste qu'à créer mes images ! Je balise en résolu.