css

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
gilbert

css

Message par gilbert »

Bonjour,

Voici mon code HTML

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>Annuaire</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="css/a.css" rel="stylesheet" media="screen" type="text/css" />
</head>

<body>
<table summary="Coordonnées" class="annuaire">
<caption>Coordonnées</caption>

<thead>
<th id="societe" abbr="Adresse">Société</th>
<th id="adresse" abbr="Adresse">Adr.</th>
<th id="civilite" abbr="civilite">Civ.</th>
<th id="prenom" abbr="Prénom">Prénom</th>
<th id="nom" abbr="Nom">Nom</th>
<th id="telephone" abbr="Téléphone">Tél.</th>
</thead>
<tfoot>
</tfoot>
<tbody>
<tr>
<td headers="societe">n1</td>
<td headers="adresse">a1</td>
<td headers="civilite">c1</td>
<td headers="prenom">pn1</td>
<td headers="nom">n1</td>
<td headers="telephone">t1</td>
</tr>
<tr>
<td headers="societe">nc2</td>
<td headers="adresse">a2</td>
<td headers="civilite">c2</td>
<td headers="prenom">pn2</td>
<td headers="nom">n2</td>
<td headers="telephone">t2</td>
</tr>
</tbody>
</table>

</body>
</html>
Si j'écris en css

Code : Tout sélectionner

 #telephone
{
color: red;
}
c'est bien le titre de la colonne qui change de couleur. Comment changer les lignes d'une colonne ?
jv2759
Tyrannosaurus Rex
Messages : 4161
Inscription : 12 févr. 2004, 14:29

Message par jv2759 »

#telephone ne marche que pour un id, donc seul l'entête peux être en rouge.

Pour qu'une case autre chase soit en rouge il faut faire :

<td headers="telephone" class="rouge">t2</td>

.rouge{
color: red;
}
Inscrit sur la liste des abonner absent...
gilbert

Logique, pourtant ?

Message par gilbert »

Ceci marche dans Dreamweaver mais pas avec Mozilla et IE

Code : Tout sélectionner

td [headers=telephone]
{
color: red;
}

Logique, pourtant ?
jv2759
Tyrannosaurus Rex
Messages : 4161
Inscription : 12 févr. 2004, 14:29

Message par jv2759 »

car il faut coler le td[ et non pas td [
Inscrit sur la liste des abonner absent...
gilbert

OK / Mozilla mais pas IE

Message par gilbert »

OK / Mozilla mais pas IE (méchant !)
Bobe
Iguane
Messages : 742
Inscription : 28 juil. 2003, 21:29

Message par Bobe »

avec les guillemets plutôt:

Code : Tout sélectionner

td [headers="telephone"]
{
    color: red;
}
Pour mettre en valeur les colonnes, regarde du coté des éléments <colgroup> et <col>.

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>Annuaire</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="css/a.css" rel="stylesheet" media="screen" type="text/css" />
</head>

<body>
<table summary="Coordonnées" class="annuaire">
<caption>Coordonnées</caption>
<col span="5">
<col id="phone">
<thead>
<th id="societe" abbr="Adresse">Société</th>
<th id="adresse" abbr="Adresse">Adr.</th>
<th id="civilite" abbr="civilite">Civ.</th>
<th id="prenom" abbr="Prénom">Prénom</th>
<th id="nom" abbr="Nom">Nom</th>
<th id="telephone" abbr="Téléphone">Tél.</th>
</thead>
<tfoot>
</tfoot>
<tbody>
<tr>
<td headers="societe">n1</td>
<td headers="adresse">a1</td>
<td headers="civilite">c1</td>
<td headers="prenom">pn1</td>
<td headers="nom">n1</td>
<td headers="telephone">t1</td>
</tr>
<tr>
<td headers="societe">nc2</td>
<td headers="adresse">a2</td>
<td headers="civilite">c2</td>
<td headers="prenom">pn2</td>
<td headers="nom">n2</td>
<td headers="telephone">t2</td>
</tr>
</tbody>
</table>

</body>
</html> 
et:

Code : Tout sélectionner

col#phone { color: red; }
Mais le style 'color' ne fonctionnera pas dans Mozilla (le background-color fonctionne par contre, depuis les toutes dernières versions).
« La vie d’un geek est un combat perpétuel contre l’imperfection »
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 2 invités