Das altehrwürdige <table>-Tag ist das semantischste HTML zur Darstellung tabellarischer Daten. Aber ich finde es sehr schwer zu kontrollieren, wie die Tabelle präsentiert wird, insbesondere die Spaltenbreiten in einer dynamischen Umgebung, in der man vielleicht nicht weiß, wie …
Als ich kürzlich „Making Tables With Sticky Header and Footers Got a Bit Easier“ bloggte, erwähnte ich, dass die Verbesserung der „Stickiness“ nur eine der Funktionen war, die für <table>s in Chrome im Rahmen des TablesNG-Upgrades besser geworden sind…
Wir haben bereits behandelt, dass einzelne <table> Zellen, <th> und <td> position: sticky sein können. Es ist ziemlich einfach, den Header einer Tabelle beim Scrollen durch viele Zeilen oben auf dem Bildschirm zu fixieren (wie in diesem ...
Vor über zwanzig Jahren waren Tabellen die Hauptmethode, mit der Webseiten in HTML erstellt wurden. Sie gaben Webentwicklern die konsistente Kontrolle über die Erstellung von Seiten mit „Design“. Nicht mehr mussten Websites nur linear von oben nach unten verlaufen – …
Gedrehte <table> Spaltenüberschriften wurden bereits hier auf CSS-Tricks behandelt. Ein großes Dankeschön dafür, dass es mich inspiriert und mir geholfen hat, diesen Effekt zu erzielen. Wie im Artikel hervorgehoben wird, wenn Sie keine Trigonometrie zur Berechnung verwenden…
Hier ist ein fantastischer CSS-Trick von Bradley Taunt, bei dem er zeigt, wie man Tabellen mit nur *einem kleinen* bisschen zusätzlichem Code mobilfreundlich macht. Er formatiert jede Tabellenzeile in eine Karte, die etwa so aussieht:…
„Expando Rows“ ist ein Konzept, bei dem mehrere zusammengehörige Zeilen in einer <table></table> zusammengeklappt sind, bis man sie öffnet. Das würde man im Jargon des Interaktionsdesigns als „progressives Offenlegen“ bezeichnen.
Nach all den Jahren auf CSS-Tricks habe ich ein *klein wenig* besseres Gespür für …
Man kann keine position: sticky; auf ein <thead></thead> anwenden. Auch nicht auf eine <tr></tr>. Aber man kann ein <th></th> "sticky" machen, was bedeutet, dass man *doch* Sticky-Header innerhalb einer ganz normalen <table></table> erstellen kann. Das ist knifflig, denn wenn man es nicht wüsste…
Chen Hui Jing hat sich mit einer Fülle von Designmustern für Tabellen beschäftigt, die nützlich sein könnten, wenn man Tabellen erstellt, die leicht zu lesen und für das Web responsive sind
…Es gibt eine Vielzahl von Tabellen-Designmustern,
