2010-08-24 9 views
0

Y at-il un moyen de masquer une table particulière qui n'a pas de classe en utilisant le style de table à sélectionner?CSS: masquer la table sans la classe ou l'ID

Par exemple, si j'avais une table avec ce nom

<table border="0" cellspacing="0" cellpadding="0" width="300" height="100"> 

ou

<td colspan="3"> 

Je n'ai pas accès au html et ne peut pas utiliser javascript, doit être une solution de css.

Répondre

1

Si vous êtes prêt à sacrifier la compatibilité IE 6, vous pouvez à elle en fonction des attributs avec le attribute selector. Par exemple:

td[colspan="2"] {color: red} 
table[border="0"][cellspacing="0"][cellpadding="0"][width="300"][height="100"] {text-align: center} 

Sinon, vous pouvez essayer de sélectionner la table en fonction du contexte (par exemple div.container div.innercontainer table).

+0

Cela fonctionnera pour ce que j'ai besoin de faire, merci. – tim

1

Vous pouvez utiliser un sélecteur contextuel pour spécifier exactement qui <table> que vous souhaitez masquer en fonction de son élément parent (étant donné qu'il est assez unique dans le balisage des autres <table> s):

Donc, si vous avez:

<div><p><table border="0" cellspacing="0" cellpadding="0" width="300" height="100"></table></p></div> 

Ensuite, vous pouvez faire:

div p table { 
    display: none; 
} 

Compatible sur la plupart des navigateurs modernes (y compris IE6).

+0

c'est de loin la réponse la plus pertinente. +1 – Latze

2

Est-ce que toutes les autres tables ont des classes? Si oui, vous pouvez cacher toutes les tables et afficher uniquement ceux avec des classes:

table { dispaly: none; } 
table.someClass1, 
table.someClass2 { display: table; } 

Gardez à l'esprit, ce cachera toutes les tables et afficher uniquement ceux que vous spécifiez dans la clause avec « display: table ».

1

Vous pouvez appliquer des règles à l'aide d'attrbutes. Combiné avec les sélecteurs contextuels peut résoudre votre problème:

div#page-foo div.bar td[colspan=3] { 
    display: none; 
}