Schlagwort: css

Ja, auch das Thema ist schon „älter“, spätestens mit iOS 13 (Mitte 2019) war das Thema irgendwie in aller Munde. Seitdem meint ‚Dark Mode‘ eine Einstellung, die meist hellen Hintergründe und Flächen von Webseiten und […]

1. Worum es geht… Ich nutze den „Hidden Checkbox Hack“ und CSS, um iOS-like Kippschalter (Toggles, Switches) zu gestalten. Diese sehen am Ende so aus:   2. Das HTML Das HTML ist ein umwrappendes div, […]

Wer Lernplattformen (Lernmanagementsysteme, LMS) oder Content-Management-Systeme (CMS) für Menschen betreibt, die nie von selber auf die Idee kämen, HTML / CSS zu lernen und daher auch nie im „HTML-Modus“ eigenes CSS schreiben, kommt früher oder […]

Ich finde CSS-Transitions und Animations ja ziemlich lustig 🙂 und wollte schon immer so eine Web-Slideshow basteln ohne irgend ein JavaScript basteln. Hier mal ein Beispiel: Slide01 Slide02 Slide03 Slide04 Slide05 Das war einfacher als […]

Kategorie: Onlinekram
Tags: , ,

Wie angekündigt, hier ein dritter Teil der Serie zur DSGVO. Die anderen beiden gibt es hier (Teil 1) und hier (Teil 2). Folgende Modifikationen und Einstellungen habe ich vorgenommen: 1. WordPress-Funktionen Ich empfehle ein eigenes […]

Hier also – wie angekündigt – ein weiteres Projekt aus der Kategorie „Funny CSS Stuff“: Heute geht es um animierte, halbwegs realistisch hübpfende bunte Bälle mit Schatten: Los gehts: 1. Das HTML: Weniger ist mehr […]

Kategorie: Onlinekram
Tags: , ,

Selten habe ich einen so dermaßen treffenden Beitragstitel geschrieben 🙂 Hier geht es also um die reine CSS-seitige Gestaltung von Post-Its und/oder Notizzetteln, die dann z.B. so aussehen können: Post-It Ein wenig Text … … […]

Kategorie: Onlinekram
Tags: , ,

1. Warum ich Flexbox-Fan bin? Vorkonfektionierte Frameworks wie das Responsive Grid System, xy.css, pure.css, Bootstrap oder UIkit haben sicher ihre Vorteile, sind aber in der Nutzung nicht immer supereinfach, Außerdem bin ich – und der/die […]

Kategorie: Onlinekram
Tags: ,

Zu Beginn wieder eine Spielerei 🙂 Rakete! Via jQuery wird über den Button eine Klasse zweier Container (für die Rakete und den Hintergrund) getoggelt, bei denen die Position mittels CSS Transition animiert wird. Download: Rakete. […]

CSS-Filter sind Manipulationen an Texten oder Bildern ist eine „nicht-destruktive“ Veränderung. Das „Original“ wird also nicht verändert, sondern lediglich in der Ausgabe (hier dem Rendering des Browsers) nach entsprechenden Vorgaben angezeigt. Bilder und Texte können […]

Kategorie: Onlinekram
Tags: ,

Ein erstes „reines CSS“-Beispiel – eine nette Spielerei: Dieses Anwendungsbeispiel verwendet unprefixed transitions. Funktioniert nicht in Internet Explorer 9 (oder älter) und nicht in Oprea mini. Vgl. https://caniuse.com/#search=transitions Los / Zurück Hier verwende ich übrigens […]

Kategorie: Onlinekram
Tags: , ,

Bei dem Artikel zu CSS-Transitions ist mir mal wieder aufgefallen, wie selbstverständlich (sprich: altmodisch, da desktop-sozialisiert 🙂 ) man mit der Pseudoklasse :hover umgeht, obwohl doch Benutzer von Endgeräten mit Touchscreens nicht „hovern“ können. Da […]

Was sind Transitions und wem können sie zugewiesen werden? Transitions sind dynamische Änderungen von CSS-Eigenschaften. Diese können so manipuliert werden, dass weiche fließende Übergänge entstehen, welche wie Animationen wirken. Transitions sind nicht zu verwechseln mit […]

Kategorie: Onlinekram
Tags: ,

Die in der Überschrift angedeutete Anforderung kommt mir unter allem bei eingebetteten Videos unter. Daher bezieht sich das Beispiel auf diesen Anwendungsfall, lässt sich aber problemlos auf andere Anwendungen – z.B. im CMS/LMS hochgeladene Videos […]

Kategorie: Onlinekram

Den Anspruch „Footer immer unten“ hat man vor allem, wenn man Seiten mit wenig Content hat. Konstruieren wir mal ein Beispiel. Ein gängiger Seitenaufbau nach dem Strickmuster „Header – Content – Footer“ sieht ja oft […]

Kategorie: Onlinekram
Tags: , ,