Bootstrap Tabellen Design
|
|
Catzenjaeger |
Geschrieben am 12. August 2016 07:48:25
|
![]() |
Ich beschäftige mich jetzt intensiv damit und baue noch immer an meiner Datenbank. Sie ist nun so gut wie fertig aber ich will noch paar Sachen mehr nutzerfreundlich machen Ich hatte zuerst eine Tabelle mit 4 Spalten nebeneinander wo ich entsprechend Daten eingeblendet habe. Aber am PC sah das gut aus aber auf den Tablet und Smartphone nicht da war alles verschoben. Jetzt habe ich das so gemacht , dass ich nur 2 Spalten habe (eine zeigt die Beschreibung das andere die Daten) und das sieht soweit ok aus. Auch das Problem mit Zeilenumbruch konnte ich lösen ... hoffe ich doch ... falls jemand ellenlange Wörter postet und die das Layout zerstören würden weil sie seitlich überlaufen. Aber ich wollte mal so fragen . Das sieht am PC jetzt nicht mehr so schön kompakt aus wie vorher mit 4 Spalten . Gäbe es eine Lösung das so zu machen das Tabellen automatisch umbrechen je nach Auflösung ? Heißt, am PC 4 Spalten aber auf Smartphone nur 2 Im Anhang mal ein Bild wie es am PC aussieht momentan. Ich habe aber einige User die nur mit Smartphone darauf zugreifen und würde das wie gesagt für alle so schön wie möglich machen habe schon gedacht einfach 2 Buttons mit Auswahlmöglichkeit einzubauen .. einmal Kompaktansicht (4 spalten) einmal die 2spaltige Version wie würdet ihr das lösen oder habt ihr Ideen, Vorschläge .. was auch immer :)
Catzenjaeger hat folgende Datei angehängt:
|
Information: |
PHP Version: Nicht ausgewählt • MySQL Version: Nicht ausgewählt • ![]() |
|
|
Janilein |
Geschrieben am 12. August 2016 08:49:08
|
![]() |
Vielleicht hilft dir das hier etwas weiter: https://wiki.selfhtml.org/wiki/CSS/Anwendung_und_Praxis/Tabellen_responsiv_gestalten oder aber dieses hier: http://maddesigns.de/responsive-tables-2393.html |
Information: |
PHP Version: Nicht ausgewählt • MySQL Version: Nicht ausgewählt • ![]() |
|
|
David |
Geschrieben am 12. August 2016 09:04:25
|
![]() |
Weitere Möglichkeiten wären noch: 1.) Das Grid-System von Bootstrap nützen und auf DIVs umstellen (col-lg, col-md, col-sm, col-xs). 2.) Eine 4 Spaltige Tabelle erstellen welche nur sichtbar ist auf "lg" und "md", und eine 2 Spaltige Tabelle welche nur auf "sm" und "xs" sichtbar ist. |
Information: |
PHP Version: Nicht ausgewählt • MySQL Version: Nicht ausgewählt • ![]() |
|
|
Catzenjaeger |
Geschrieben am 12. August 2016 10:02:09
|
![]() |
Habe es umgesetzt. Die Figuren werden jetzt ohne jegliche Tabellen angezeigt. Wenn es mal verstanden hat einen feine Sache. Allerdings vermisse ich paar Dinge wie zB das Zebramuster was ich nun nicht mehr umsetzen kann weil es das nur für Tabellen gibt. Danke euch beiden für eure Antwort Bearbeitet von Catzenjaeger am 13. August 2016 18:14:21 |
Information: |
PHP Version: Nicht ausgewählt • MySQL Version: Nicht ausgewählt • ![]() |
|
Springe ins Forum: |