Weise, breite Tabelle ordentlich zu zeigen

Question

Ich mache einen grundlegenden Bildschirm, der einfach ein Raster der Daten zeigt, aber das Rasterfeld kann mehr Spalten haben, als der Bildschirm bewältigen kann. Ich plane, Bootstrap zu verwenden, aber nur für seine Kontrollen, Aussehen und Gefühl. Die Seite muss jedoch nicht für Mobilgeräte skaliert werden.

Ein sehr einfaches Beispiel für die Daten, die ich wie folgt aussieht bin zeigt:

https://jsfiddle.net/bunwt5cy/1/

Also, erste Spalte nur eine fortlaufende Nummer ist, durch ein Datum gefolgt, und dann die Daten. Die Anzahl der Spalten kann von 1 bis 20 reichen. Jede Spalte (Zelle) hat dann 3 finanzielle Werte (2 in der Demo gezeigt) von 0,00 bis 99,999,99 (um die benötigten Größen anzuzeigen).

Ich verwende derzeit <TABLE>, aber gibt es einen besseren Weg, Bootstrap, um dies zu tun? Kann es mit DIVs besser gemacht werden? Und wenn ich das tue, bin ich auf 12 Divs pro Reihe beschränkt? Wenn ja, dann ist das keine Option, da mein Raster> 12 Spalten haben kann.

Hier ist ein Beispiel für einige Zeilen. Ich versuche es übersichtlicher zu gestalten und bestmögliche Best Practices zu verwenden, aber auch schön zu machen.

Answer 1

Als Best Practice sollten Sie table Element für eine solche tabellenähnliche, tabellarische Daten zu verwenden, während die Verwendung von CSS, um es „schön“ zu machen.

Die div element nach den HTML5-Spezifikationen:

Das div-Element überhaupt keine besondere Bedeutung hat ...

Autoren stark gefördert werden, um das div-Element als ein Element des letzten Auswegs zu sehen, wenn kein anderes Element geeignet ist. Die Verwendung von geeigneteren Elementen anstelle des div-Elements führt zu einer besseren Zugänglichkeit für Leser und einer leichteren Wartbarkeit für Autoren.

In diesem Fall table verfügbar ist, ist es für tabellarische Daten geeignet ist, so in Bezug auf die bewährte Methode sollten Sie anstatt div mit table Element für eine solche tabellarische Daten fortzusetzen.