Mon arrière-plan n'apparaît pas

Pour quelque raison, l'arrière-plan n'apparaît pas.Mon arrière-plan n'apparaît pas

C'est le CSS

div.sidebar_beige { 
background: no-repeat left top; 
height: 142px; 
margin: 35px 0 35px 0; 
position: relative;} 

div.sidebar_beige h3 { 
    color: #f57f20; 
    font-family: 'trebuchet ms'; 
    font-size: 17px; 
    left: 15px; 
    margin: 0px; 
    padding: 0px; 
    position: absolute; 
    top: 15px; 
    width: 163px; 
} 
div.sidebar_beige p { 
color: #454343; 
font-family: 'trebuchet ms'; 
font-size: 12px; 
left: 15px; 
margin: 0px; 
padding: 0px; 
position: absolute; 
top: 42px; 
width: 165px;} 

div.sidebar_fcs { 
background-image: url('../images/sidebar_backup_online.png'); 
} 
div.sidebar_lap { 
background-image: url('../images/sidebar_backup_laptoprepara.png'); 
}

Ceci est le code html utilisé:

<div class="sidebar_lap sidebar_beige"> 
      <h3> 
       Laptop Reparatie 
      </h3> 
      <p> 

       U kan niet gelijk een nieuwe<br /> 
      laptop kopen? <br /> 
      We zijn de goedkoopste<br /> 
      van Friesland. 
      </p> 
      </div>

Source

2010-02-28 Chris

Vous pouvez utiliser l'ordre de overrides à votre avantage ici:

Faire la copied.css juste comprennent:

div.sidebar_beige_lap { 
    background: url('../images/sidebar_backup_laptoprepara.png') no-repeat left top; 
}

Dans votre page, les inclure dans l'ordre:

<link rel="stylesheet" href="original.css" /> 
<link rel="stylesheet" href="copied.css" />

Toutes les propriétés surchargées dans copied.css va gagner, sinon les propriétés de original.css sont héritées du passé.

Source

2010-02-28 12:28:24

Lorsque j'ai beaucoup de différentes pages je vais avoir environ 12 feuilles de style différents dans mon dossier css;) – Chris

@ Chris, vous pouvez faire la même chose avec une balise de style, ou un chevauchement de styles, l'exemple de plusieurs feuilles était juste pour correspondre à votre scénario d'origine. –

Je comprends ce que vous voulez dire, je vais essayer pour votre réponse – Chris

utiliser deux classes sur votre div:

<div class="sidebar lap">...

Tirez le mage bg de la classe de barre latérale afin que tous les divs peuvent partager. La mise en place d'une nouvelle classe pour chaque bg différent dont vous avez besoin (lpa, fcs, etc) qui contient seulement l'image bg.

Source

2010-02-28 12:28:40 Ray

Utilisation de plusieurs missions de classes CSS:

HTML FCS:

<div class="sidebar_fcs sidebar_beige">...</div>

HTML LAP:

<div class="sidebar_lap sidebar_beige">...</div>

CSS simple:

div.sidebar_beige { 
background: no-repeat left top; 
height: 142px; 
margin: 35px 0 35px 0; 
position: relative; 
} 
div.sidebar_beige h3 { 
color: #f57f20; 
font-family: 'trebuchet ms'; 
font-size: 17px; 
left: 15px; 
margin: 0px; 
padding: 0px; 
position: absolute; 
top: 15px; 
width: 163px; 
} 
div.sidebar_beige p { 
color: #454343; 
font-family: 'trebuchet ms'; 
font-size: 12px; 
left: 15px; 
margin: 0px; 
padding: 0px; 
position: absolute; 
top: 42px; 
width: 165px; 
} 
div.sidebar_fcs { 
background-image: url('../images/sidebar_backup_online.png'); 
} 
div.sidebar_lap { 
background-image: url('../images/sidebar_backup_laptoprepara.png'); 
}

Source

2010-02-28 12:34:14

J'ai essayé votre solution mais l'arrière-plan ne s'affiche nulle part, j'ai mis à jour ma demande avec votre sollicution. – Chris

@Chris, oups, la classe pour le div 'sidebar_beige_lap' devrait être 'sidebar_lap'. J'ai corrigé la faute de frappe dans ma réponse. –

Si possible, la meilleure façon est de donner à chaque page au nique ou classe utile et/ou ID sur l'élément de corps. Donc, juste un exemple, une page est:

<body class="bg-custom">

et un autre est

<body class="bg-custom-right">

Ensuite, dans votre CSS, vous pouvez le modifier comme ceci:

.bg-custom #selector { background-img: url(...);} 
.bg-custom-right #selector { background-img: url(...);}

où #selector est le élément que vous voulez changer sur chaque page - mais sans avoir à donner à chacun ses propres règles de style (copiées) ou son (s) nom (s) de classe, ce qui rend votre CSS et HTML plus propre et plus facile à maintenir. (En prime, si vous avez besoin d'utiliser la même astuce pour l'édition par page, vous pouvez le faire.)

Source

2010-02-28 12:34:50

Votre image d'arrière-plan est sur la classe sidebar_lap.

Dans votre HTML utiliser sidebar_beige_lap

Changer votre code HTML à

<div class="sidebar_lap sidebar_beige">

Source

2010-02-28 13:09:53 Keith

J'ai trouvé cette erreur aussi, mais toujours pas de chance – Chris

Répondre

Questions connexes