2010-10-04 35 views
3

Ma compréhension de col est qu'il peut être utilisé pour indiquer une classe pour tous les éléments de la colonne d'une table. Cela ne semble pas fonctionner pour moi cependant. Je peux appliquer la classe aux td individuels, mais je veux que col m'aide à éviter cela.<col class = "slick"> n'applique pas de classe aux colonnes d'une table

Voici la tête html:

<head> 
<style type="text/css"> 
.slick { 
    background-color:#b0c4de; /*This always works*/ 
    border-style:solid; /*This doesn't work when only applied to a <col>*/ 
    border-width:5px; 
} 
</style> 
</head> 

Fait intéressant, la couleur de fond fonctionne toujours, mais la frontière échoue parfois.

est ici le corps html:

<body> 
<table><tbody> 
<colgroup> 
    <col class="slick" /> 
    <col class="slick" /> 
</colgroup> 
<tr id="r1"> 
    <td><label >Planner/Scheduler/Estimators</label></td> 
    <td class="slick"><label >2010</label></td> 
</tr> 
</tbody></table> 
</body> 

supprimer les balises tbody ou colgroup ne semble pas à la matière. Le fond est présent dans les deux éléments; la bordure est uniquement appliquée au deuxième élément, où la classe est spécifiée dans la balise td. J'ai eu l'intuition que la bordure ne fonctionnerait pas avec col, mais Firebug montre que le style lisse n'est pas du tout appliqué à la colonne de gauche. Qu'est-ce qui ne va pas?

Répondre

4

Selon les écoles W3, seul l'attribut width fonctionne dans Firefox. Il ne semble pas non plus que l'attribut border soit supporté.

http://www.w3schools.com/tags/tag_col.asp

+0

De plus, son lien vers W3Schools dit ceci: « . Ajoutez l'attribut de style à la balise , et laissez CSS prendre soin des arrière-plans, la largeur et les frontières Ce sont les seules propriétés CSS qui fonctionnent avec la balise . " –

+0

Très bien, je pensais que col était une sorte d'application plus forte. C'est-à-dire, je pensais que la mise en place d'une classe forcerait fondamentalement tous les td à avoir cette classe, et que le CSS s'appliquerait complètement. – jtpereyda

+0

J'ai vérifié cette page, mais je n'ai pas bien compris ce que cela signifiait quand il disait que certains attributs ne fonctionnaient pas. Je pensais à la classe comme un attribut entièrement séparé qui permettrait à CSS de fonctionner de toutes les façons. On dirait que ça ne marchera pas, merci les gars! :( – jtpereyda

0

En effet, le CSS 2.1 specification defines que les différentes propriétés de bordure appliquent uniquement lorsque vous définissez border-collapse: collapse; sur l'élément lié <table>.

En outre, selon CSS 2.1, il n'y a que très peu de propriétés, qui peuvent être utilisées à des colonnes de style (avec des restrictions):

  • propriétés frontalières (besoin border-collapse: collapse; sur l'élément <table> lié)
  • fond les propriétés (concernent que si la cellule et le fond est transparent rangée)
  • width
  • visibility (valeur collapse évite le rendu des cellules , les cellules couvrant d'autres colonnes sont tronquées)
0

Vous n'avez pas besoin d'appliquer des classes à chaque td.

Vous pouvez simplement le style de la TD:

td { 
    background-color:#b0c4de; 
    border-style:solid; 
    border-width:5px; 
}