CSS Responsive Design mit Bootstrap

smej

Ensign
Registriert
Dez. 2006
Beiträge
170
Hey Leute,

ich bau gerade an meiner Webseite für Hardware Reviews und will diese natürlich auch responsive gestalten für mobile Entgeräte. Bräuchte da mal ein bisschen Hilfe via Skype oder so wenn möglich :) Wenn jemand lust hat mir bei ein zwei Fragen zu helfen kann gerne hier seinen Nick von Skype posten dann adde ich euch/dich :D

1. Alles über die Standard "col" Werte anpassen?
2. Oder für alles eine Extra "@media (max/min-width: )" CSS Klasse?

Gruß
ro0ki
 
Zuletzt bearbeitet:
Frag lieber direkt hier im Forum. So hast du eine breitere Masse an Leuten, die dir helfen können. Zusätzlich schaffst du einen Mehrwert für andere Einsteiger, die vor den selben Problemen stehen :)
 
einfach alles über col-Werte anpassen.

ein "col-xs-*" ist für ganz kleine Geräte über "col-sm-*" zu "col-md-*" bis zu "col-lg-*" für große Geräte. Dadurch ändert sich Hauptsächlich das Verhalten wann es nicht mehr in einer Zeile ist, sondern umbricht. So kannst du auch unterschiedliche Layouts auf unterschiedlichen Geräten erreichen. Mit "row" kannst du auf jeder Größe eine neue Zeile erzwingen, auch sehr praktisch.

Das ganze kann man gut in der Kombination mit "hidden-xs", "hidden-sm", "hidden-md" und "hidden-lg" verwenden, um Sachen bei bestimmten Größen gar nicht zu zeigen.

@media brachst du nie verwenden.

Hier auch noch ein praktischer Link zur Dokumentation: https://getbootstrap.com/examples/grid/
 
Zuletzt bearbeitet:
smej schrieb:
1. Alles über die Standard "col" Werte anpassen?
2. Oder für alles eine Extra "@media (max/min-width: )" CSS Klasse?

Theoretisch ist es schon so, wie 0w1p sagt und damit wirst Du erstmal anfangen. Enden wirst Du aber voraussichtlich mit der Definition von x @media-Klassen für alle möglichen verschiedene Auflösungen ;)
 
Zurück
Oben