CoupdePouce

Tableau en CSS

Pour ceux qui ont de la patience, voici l'apperçu d'un tabeau réalisé avec la feuille de style CSS.

Un site parmis des dizaines pour les codes et noms des couleurs:  delrisco 

#tableau{
background:#f5deb3;
border: solid red 2px;
width: 400px;
margin-left: auto;
margin-right: auto;    
}
#tableau td {
padding: 5px;
border: solid maroon 2px;
}
.titre {
font-style: italic;
text-align: center;
font-weight:bold;
font-size: 16px;
color:maroon;
background:url(url_image);
}
.mois{
font-style: italic;
font-weight: bold;
text-align: left;
width: 150px;
background:url(url_image);
}
.total{
text-align: right;
font-style: italic;
color: #ffff00;
font-weight:bold;
background:url(url_image);
}

Dans l'article en mode html, introduisez ce code:

<table border="2" cellspacing="1" id="tableau">
<tbody><tr class="titre">
<td>Mois</td>
<td>Visiteurs</td>
<td>Pages lues</td>
</tr>
<tr>
<td class="mois">Janvier</td>
<td class="total">123</td>
<td class="total">234</td>
</tr>
<tr>
<td class="mois">Fevrier</td>
<td class="total">135</td>
<td class="total">246</td>
</tr>
<tr>
<td class="mois">Mars</td>
<td class="total">257</td>
<td class="total">368</td>
</tr>
<tr>
<td class="mois">Avril</td>
<td class="total">515</td>
<td class="total">848</td>
</tr>
<tr>
<td class="mois">Total</td>
<td class="total">1030</td>
<td class="total">1636</td>
</tr>
</tbody></table>

Ce qui donne le résultat suivant:

Mois Visiteurs Pages lues
Janvier 123 234
Fevrier 135 246
Mars 257 368
Avril 515 848
Total 1030 1636

 

aucun commentaire - aucun rétrolien

Page précédente | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | Page suivante