Mit CSS clip-path kannst du divs in jeder beliebigen Form erstellen.
Standardmäßig ist ein div viereckig. Um außergewöhnliche Designs umzusetzen, ist es manchmal erforderlich, dass divs in einer anderen Form dargestellt werden müssen. In der Regel…
CSS
So erstellst du eine Prozessgrafik mit HTML & CSS.
Eine Prozessgrafik (oder Ablaufdiagramm) ist ein sinnvolles Gestaltungselement um Abläufe zu visualisieren. Z.B. so: Step 1 Lorem ipsum dolor sit amet consectetur adipisicing elit. Step…
jQuery-Info-Pop-up
Pop-ups nerven. Meistens. Manchmal gibt es aber eben doch eine wichtige Info, die prominent kommuniziert werden muss. Z.B. geänderte Öffnungszeiten, eine aktuelle Stellenausschreibung o.ä. ……
So kannst du einzelne Bereiche im WordPress-Backend ausblenden oder anpassen.
Hier hatte ich bereits beschrieben, wie man Änderungen am Style des WordPress-Backends vornehmen kann. Ergänze folgende Zeile in der functions.php deines Themes. Die „admin-styles.css“ kann…
CSS PageFlip-Effekt für einen Magazin-Titel
Mit folgendem HTML-Snippet lässt sich schnell und unkompliziert eine schicke kleine Animation erzeugen, die einen kleinen Einblick auf Seite 3 eines Print-Magazins gewährt und z.B.…
Focal Point – ein WordPress-Plugin mit dem man den Fokuspunkt eines Bildes definieren kann
Image-Header sind ein sehr häufig eingesetztes Element im Webdesign. In der Regel sind Image-Header im Querformat, haben eine definierte Höhe und das Bild wird als…
So kann man die WordPress-Gallery für eine Logoübersicht nutzen
Die WordPress-Gallery kann nicht nur für Bildergalerien, sondern auch für Logos genutzt werden. Das Problem hierbei ist, dass die Logos oft alle unterschiedlich groß sind…
Mehrspaltiges Layout mit gleichgroßen divs mit CSS Grid
Mit folgendem Code lässt sich mit CSS Grid ein mehr-spaltiges Layout mit divs in gleicher Höhe ohne jQuery oder JavaScript umsetzten. Box 1 Lorem ipsum,…
CSS-Variablen
In Programmiersprachen sind Variablen gang und gäbe. Auch in Sass gibt es Variablen. Und tatsächlich gibt es auch in CSS die Möglichkeit Variablen einzusetzen. Genau…
Nur bestimmte Wörter trennen
Die CSS-Silbentrennung (hyphens: auto) ist gleichzeitig Fluch & Segen. Einerseits ist es praktisch und vermeidet, gerade bei schmalen Textspalten, größere Lücken im Text, andererseits entstehen…
CSS für Touchscreens
Mit folgendem Media-Query können CSS-Eigenschaften definiert werden, die nur auf Touchscreens angewendet werden.
Bilder croppen mit CSS
Um ein Bild in´s richtige Format zu croppen, ist heute weder PHP erforderlich, noch muss man es als Hintergrundbild in ein div einbauen. Mit der…