Background différent pour chaque catégorie

Bad Wolf -  
 Bad Wolf -
Bonjour,
Je tiens un site et j'utilise le code suivant pour l'arrière plan :

<img src="image.jpg" id="bg" alt="">


#bg {
/* Set rules to fill background */
min-height: 100%;
min-width: auto;

/* Set up proportionate scaling */
width: 100%;
height: auto;

/* Set up positioning */
position: fixed;
top: 0;
left: 0;
}
@media screen and (max-width: 1024px) {
img.bg {
left: 50%;
margin-left: -512px; /* 50% */
}
}


Et j'aimerais savoir comment faire pour appliquer une image de fond différente pour une autre catégorie...

4 réponses

  1. elgazar Messages postés 5776 Date d'inscription   Statut Membre Dernière intervention   1 330
     
    Bonjour
    en html, il suffit de créer un id bg (bg1, bg2,bg3, etc) pour chaque page puis de mettre autant de styles différents

    en php, il faut utiliser la commande if else pour changer l'id de la div suivant la page demandée, tu dois donc remplacer la ligne <div id="bg">
    par les lignes en gras

    if (categorie=1){
    echo <div id=" bg1">
    }
    elseif (categorie=2){
    echo <div id="bg2">
    }
    else {
    echo <div id="bg3">
    }

    le code a l'intérieur de la div background
    </div> // fin div background


    ainsi le code va afficher l'id de la div bg1 pour la catégorie 1 ou bg2 pour la catégorie 2 ou bg3 pour les autres catégories et utilisera les css correspondantes

    le code est juste un exemple,c'est juste pour expliquer le principe il faut que tu le modifies en fonction de ton propre code.
    0
  2. Bad Wolf
     
    Bonjour,
    Merci d'avoir répondu si rapidement
    Cependant ça ne marche pas...

    Dès que je crée une deuxième balise
    <img src="image.jpg" id="bg2" alt="">
    , tout se dérègle et le fond devient blanc...
    0
  3. elgazar Messages postés 5776 Date d'inscription   Statut Membre Dernière intervention   1 330
     
    Je n'ai pas dit que cela fonctionnerait tel quel, il faut l'adapter au code de ton site
    0
  4. Bad Wolf
     
    Sauf que je ne sais pas comment faire...
    0