Ways erste Spalte der Tabelle durch

Question

CSS zu verstecken

Dieser Code auf andere Browser als IE funktioniert:

table.tbl.tr.td:first-child { display: none; } 

Was soll ich verwenden, um es auf allen Browsern funktioniert?

Answer 1

Leider unterstützen ältere Versionen von IE nicht: First-Child in CSS. Ich weiß nichts über IE8. Wie auch immer, wenn du kein Javascript willst und Zugriff auf das HTML hast, ist es ziemlich einfach, eine "erste" Klasse der ersten Spalte tds in der Tabelle zuzuweisen. So wird die html wie folgt aussehen:

<table> 
    <tr> 
    <td class="first">...</td> 
    <td>..</td> 
    .. 
    </tr> 
</table> 

Anschließend können Sie eine CSS-Eintrag wie erstellen:

table td.first { display: none; } 

Answer 2

Nun, die kurze Antwort ist, dass Sie dies nicht in früheren Versionen von IE funktioniert. Ich vermute, IE8 würde damit umgehen. Es gibt einen CSS-Hack namens Ausdrücke, der das Problem lösen würde, aber Ausdrücke sind so eine schlechte Idee, ich werde Ihnen nicht einmal zeigen, wie es geht.

Behalten Sie Ihr CSS so, wie es ist, und fügen Sie ein JavaScript hinzu, das dasselbe für Sie auf DOMReady tut, wenn der Client in IE ist.

Answer 3

Leider kann sehr wenig getan werden. scheint verlockend, aber Browser behandeln es anders. Sie müssen möglicherweise manuell eine Klasse für jede Zelle hinzufügen oder JavaScript verwenden.

Answer 4

Ihr Ausdruck oben wird nicht funktionieren. table.tbl.tr.td wählt ein Tabellenelement aus, das wie folgt definiert ist: <table class="tbl tr td">, aber nicht seine Zellen.

es so sein sollte und die :first-child selector ist in so ziemlich alle Browser über Internet Explorer 6 unterstützt:

table.tbl tr td:first-child { display: none; } 

Answer 5

Für IE sollten Sie/könnte der Lage, dann für Ihre Tabellenspalten nach oben col und colspans eingestellt sein verstecken die in CSS.

Soweit ich weiß, wird dies nur in IE funktionieren, die (für einmal, es ist Kredit) hat die beste Umsetzung von Col und Colspan. Andere Browser sind schwach hier (aber es ist ein sehr kleiner Teil der Spezifikation)

Answer 6

ausblenden ersten Spalte

table td:nth-child(1){ display:none;} 

OK funktioniert in Chrome + FireFox, aber nicht in IE

Verwendung JQuery Cross-Plattform zu handhaben Probleme mit:

$('table td:nth-child(1)').hide(); 

funktioniert in allen Browsern!

Answer 7

einfach verwenden:

table td:nth-child(n){ 
    display:none; 
} 

wobei n die Spalte, die Sie ausblenden möchten.Hier

ist ein Anwendungsbeispiel:

table.marks.hideSubject  {td:nth-child(1) {display: none;}} 
table.marks.hideDescription {td:nth-child(2) {display: none;}} 
table.marks.hideMark   {td:nth-child(3) {display: none;}} 
table.marks.hideRank   {td:nth-child(4) {display: none;}} 

Answer 8

von CSS n-te-Kind verwenden, können wir die Spalten ausblenden. Sie müssen nur die TABLE ID und Spaltenindizes angeben.
In diesem Beispiel verstecke ich die letzten 3 Spalten der Tabelle.

<style> 
    #ID_OF_THE_TABLE tr *:nth-child(10),tr *:nth-child(9),tr *:nth-child(8){ 
     display: none; 
    } 
</style> 

Answer 9

die Lösungen, die für mich gearbeitet, war:

td { display: none; } 
td + td { display: table-cell; } 

Keine Notwendigkeit von JavaScript, keine Notwendigkeit der Extraklasse.

Prost