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










Metaprime Studio

Send a

message

Wir sind hier, um jede deiner Fragen zu beantworten.

Email : info@metaprime.at

Kostenloses Website StrategiegesprĂ€ch​

In einem kostenlosen Web StrategiegesprÀch, decken wir ungenutztes Potenziale Ihrer Webseite auf und erarbeiten eine Strategie, damit Du mit Deiner Webseite auf Google erfolgreicher wirst