„CSS-Framework“ – Versionsunterschied
| [gesichtete Version] | [gesichtete Version] |
Inhalt gelöscht Inhalt hinzugefügt
Aka (Diskussion | Beiträge) K →Weblinks: Halbgeviertstrich, Kleinkram |
K wikilinks |
||
| Zeile 7: | Zeile 7: | ||
** den möglichen Grundbreiten des [[Viewport]]s und eventuelle Breakpoints, |
** den möglichen Grundbreiten des [[Viewport]]s und eventuelle Breakpoints, |
||
** der Verwendung von [[Pixel]] (px), der aktuellen Schriftgröße ([[em (Schriftsatz)|em]]) oder prozentualen Werten für Breitenangaben, |
** der Verwendung von [[Pixel]] (px), der aktuellen Schriftgröße ([[em (Schriftsatz)|em]]) oder prozentualen Werten für Breitenangaben, |
||
** |
** der Anzahl der [[Spaltensatz|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 |
* Vor allem größere Frameworks bieten auch zahlreiche '''graphische Elemente''' wie |
||
** [[Webtypografie]], |
** [[Webtypografie]], |
||
| Zeile 26: | Zeile 26: | ||
== Siehe auch == |
== Siehe auch == |
||
* [[Webframework]] |
* [[Webframework]] |
||
* [[Liste von Webframeworks]] |
|||
== Einzelnachweise == |
== Einzelnachweise == |
||
Version vom 16. Juli 2022, 22:03 Uhr
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[1]
- 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
Einzelnachweise
- ↑ Archivierte Kopie ( des vom 31. Mai 2015 im Internet Archive) Info: Der Archivlink wurde automatisch eingesetzt und noch nicht geprüft. Bitte prüfe Original- und Archivlink gemäß Anleitung und entferne dann diesen Hinweis.
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.