CSS : faire une ligne sur 2 avec un background gris dans ma fiche produit (caractéristiques) [Résolu]

[Gavimse]

Bonjour,

J'ai ça sur les caractéristiques de ma fiche produit. Presta 1.7

J'aimerais faire une ligne sur 2 avec un background gris.

Comment faire?

 

<dl class="data-sheet">
                        <dt class="name">Matériau Jante</dt>
            <dd class="value">Aluminium grg</dd>
                          <dt class="name">Matériau Rayon</dt>
            <dd class="value">Acier Galvanisé + Cataphorèse noir</dd>
                          <dt class="name">Matériau Écrous de Rayon</dt>
...

 

Edited July 12 by Gavimse (see edit history)

[Knowband Plugins]

Bonjour,

Pour alterner la couleur de fond de chaque ligne dans la liste des caractéristiques de votre fiche produit, vous pouvez utiliser du CSS. Voici le CSS que vous pouvez utiliser :
.data-sheet dt:nth-child(4n-3),
.data-sheet dd:nth-child(4n-2) {
background-color: #f0f0f0; /* Couleur de fond gris clair */
}
Les sélecteurs :nth-child(4n-3) et :nth-child(4n-2) ciblent les lignes impaires de votre liste. Cela appliquera une couleur de fond gris clair à chaque dt et dd impair.

[Gavimse]

Bonjour,

Merci pour votre solution. En la copiant tel quelle, seule la colonne de droite avait une ligne sur deux en gris.

J'ai donc fait ça :

.data-sheet dt:nth-child(4n-3),
.data-sheet dt:nth-child(4n-2) {
background-color: #f0f0f0; /* Couleur de fond gris clair */
}

.data-sheet dt:nth-child(4n-3),
.data-sheet dd:nth-child(4n-2) {
background-color: #f0f0f0; /* Couleur de fond gris clair */
}

Je ne sais pas si c'est "propre" mais ça fonctionne.