Domanda

La mia comprensione di col è che può essere usato per indicare una classe per tutti gli elementi nella colonna di una tabella. Questo non sembra funzionare per me però. Posso applicare la classe a individuo td di, ma voglio COL di aiutarmi a evitare questo.

Questa è la testa 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>

È interessante notare che il colore di sfondo funziona sempre, ma il confine non riesce qualche volta.

Ecco il corpo 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>

La rimozione dei tag tbody o COLGROUP non sembra avere importanza. Lo sfondo è presente in entrambi gli elementi; il bordo viene applicata solo al secondo elemento, in cui la classe è specificato nel tag td.

Ho avuto la sensazione che non avrebbe funzionato confine con il Col, ma mostra Firebug che lo stile chiazza di petrolio non è applicata alla colonna di sinistra a tutti. Che cosa c'è che non va?

È stato utile?

Soluzione

Secondo scuole W3, solo l'attributo width funziona in Firefox. Inoltre non sembra l'attributo border è supportato a tutti.

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

Altri suggerimenti

Questo perché il CSS 2.1 specifica definisce che il diverso confine proprietà si applicano solo quando si imposta border-collapse: collapse; sul relativo elemento <table>.

Inoltre, secondo CSS 2.1 ci sono solo poche proprietà, che può essere usato per colonne di stile (con limitazioni):

  • proprietà del bordo (richiede border-collapse: collapse; sul relativo <table>element)
  • proprietà dello sfondo (si applicano solo se lo sfondo cella e la riga è trasparente)
  • width
  • visibility (evita collapse valore di rendering delle cellule, le cellule che vanno in altre colonne vengono tagliati)

Non è necessario applicare classi per ogni td.

Si può semplicemente lo stile del TD:

 td {
  background-color:#b0c4de;
  border-style:solid;
  border-width:5px;
 }
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top