Ein CSS-Framework ist eine Sammlung von Gestaltungselementen und Hilfsmitteln f├╝r einfaches und standardisiertes Webdesign mit CSS.
Die meisten CSS-Frameworks bieten als Basis ein Grid-Gestaltungsraster sowie einige grundlegende Gestaltungselemente wie Schaltfl├Ąchen, Men├╝s und Eingabefelder. Gr├Â├čere Frameworks bieten zudem noch JavaScript-basierte Funktionen, welche die Gestaltungselemente um zus├Ątzliche, aber in der Regel optionale Funktionalit├Ąten erweitern (Unobtrusive JavaScript).

CSS-Frameworks k├Ânnen unterschiedliche Funktionen anbieten:


  • Die Hauptfunktion ist meist ein Grid-System, besonders auch f├╝r Responsive Webdesign. Diese unterscheiden sich in
    • den m├Âglichen Grundbreiten des Viewports und eventuelle Breakpoints,

    • der Verwendung von Pixel (px), der aktuellen Schriftgr├Â├če (em) oder prozentualen Werten f├╝r Breitenangaben,

    • der Anzahl der Spalten und Reihen,

    • der relativen oder absoluten Verschachtelung von Elementen und

    • der Art und Weise der Media Queries.

  • Vor allem gr├Â├čere Frameworks bieten auch zahlreiche graphische Elemente wie
    • Webtypografie,

    • Icon-Sets in CSS-Sprites oder Icon-Fonts,

    • Styling f├╝r Dropout-Men├╝s, Tooltips, Schaltfl├Ąchen, Elemente von Webformularen und

    • Elemente f├╝r grafische Benutzeroberfl├Ąchen wie Akkordeon, Registerkarten, Galerien oder Modal-Fenster (Lightbox).

  • Zus├Ątzlich bieten viele Frameworks CSS Anpassungen, beispielsweise
    • Reset-Stylesheets zur Vereinheitlichung der Formatierungen,

    • oft verwendete CSS-Hilfsklassen (left, hide) oder

    • Equalizer, um Inhalte auf gleiche H├Âhe zu bringen.

Gr├Â├čere CSS-Frameworks verwenden CSS-Interpreter wie Sass, Less oder Stylus.

Einige weit verbreitete Beispiele sind Bootstrap, YAML, Foundation, UIkit, Skeleton oder Semantic UI.


Siehe auch


  • Webframework

  • Liste von Webframeworks

Einzelnachweise


Weblinks


  • CSS Front-end Frameworks with comparison (englisch) Vergleich zahlreicher Frameworks mit unterst├╝tzten Browsern und Nutzung von LESS/SASS

  • Awesome CSS Frameworks Aktuelle Liste von CSS Frameworks (sortiert nach Kategorie und Beliebtheit)

  • List of Best CSS Frameworks ÔÇô Die besten CSS-Frameworks helfen Ihnen, verantwortungsbewusstere Webseiten zu erstellen.
CSS-Framework










Ich stimme der Verwendung von Cookies f├╝r die Zwecke der Webanalyse und digitaler Werbema├čnahmen zu. Auch wenn ich diese Website weiter nutze, gilt dies als Zustimmung. Meine Einwilligung kann ich jederzeit widerrufen. Weitere Informationen finde ich in der Datenschutzerkl├Ąrung.

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.

Close