Table de cellules d'en-tête ( th ) en arrière-plan de couleur en CSS

J'ai de style CSS suivante pour afficher la table de données dans le bon format , mais je veux alternatif d'affichage d'arrière-plan de l'en-tête de tableau ( th ) dans une couleur différente...

Comment puis-je modifier uniquement en dessous de CSS pour obtenir le même
j'.e tous les TH3,TH5 devrait avoir fond bleu ( à l'exception du premier TH1 - il avoir de fond par défaut de rouge )
alors que TH2,TH4,TH6 devrait avoir fond jaune.

J'ai déjà essayé nième sélecteur d'enfant et j'ai lu quelque part sur+th th les deux moyens ne sont pas de travail.

 <style type="text/css">
    table {
           /*...all table attributes like fontsize etc*/
            font-size:11px;
            color:#333333;                
    }
    table th {
            /*...all th attributes like padding etc*/
            background-color:#d4e3e5;
            padding: 8px;
    }
    table td {
            /*...all td attributes like padding etc*/
            padding: 8px;
    }
    </style>

Merci pour tous reespons mais nième sélecteur d'enfant n'est pas de travail et j'ai alerdy essayé. Est-il un moyen simple de modifier le CSS et obtenir le même?

l'utilisation th:nth-child(odd) et th:nth-child(même)
Merci pour l'info!! @PRAH je l'ai déjà dit nième enfant option ne fonctionne pas dans mon CSS.
pouvez-vous créer le jsffidler pour elle, et vous pouvez également le point de navigateur et la version de test
en fait au-dessus de la CSS est appelé par le fichier jar qui est appelée par mon script unix. Donc, je suis afriad que je vais être en mesure de fournir jsffidler.
Vous pouvez utiliser th+th... syntaxe, il sera fastidieux, mais le travail...

InformationsquelleAutor | 2015-02-19

de l'essayer.,

th:nth-child(odd){ 
background-color:blue; 
}
th:nth-child(even){
 background-color:yellow; 
}

HTML:

<!DOCTYPE html>
<html>
<head>
<style>
th:nth-child(odd){ background-color:blue; }
th:nth-child(even){ background-color:yellow; }
</style>
</head>
<body>

<table>
  <tr>
    <th>heading</th>
    <th>heading1</th>
  </tr>
  <tr>
    <td>xxx</td>
    <td>yyy</td>
  </tr>
  <tr>
    <td>xxx1</td>
    <td>yyy1</td>
  </tr>
</table>

</body>
</html>

InformationsquelleAutor Sathish

violon

nth-child travaille

 th:nth-child(odd)
 {
   background-color:red; //Replace it with your desired color
 }

 th:nth-child(even)
 {
  background-color: yellow;
 }

Si vous avez des problèmes de plus, postez votre code html et css

InformationsquelleAutor Gops AB

Vous pouvez également essayer cette

table th:odd
{
       background-color:#000; //Replace it with your desired color
}

table th:odd
{
       background-color:#f00; //Replace it with your desired color
}

or you can try selecting of nth element

th:nth-child(n)
{
   background-color:red; //Replace it with your desired color
}

InformationsquelleAutor Shoeb Ansari

Vous devez vous connecter pour publier un commentaire.