1. September 2020
Mit CSS-Sourcemaps SCSS-Dateien in den Dev-Tools anzeigen
Mit Hilfe einer CSS-Sourcemap kann man SASS-Module in den Devtools im Browser anschauen.
WeiterlesenArtikel aus der Kategorie CSS
Über CSS kannst du das Aussehen deiner WordPress-Website anpassen. Mit CSS steuerst du Farben, Schriften, Abstände und das Layout deiner Website.
30. Juli 2020
Google-Fonts DSGVO-konform lokal einbinden
Wenn man auf einer Website Google-Fonts benutzt, ist es eine gute Idee, die Fonts nicht über den Google-Server zu laden, sondern lokal einzubinden. Das ist datenschutzkonform, weil damit die Schriften nicht bei jedem Aufruf nach Hause telefonieren. Für diese Aufgabe kann man ein Plugin nutzen. Man kann die Schriften aber auch ganz einfach über CSS einbinden.
Weiterlesen
30. Juni 2020
Elemente per CSS barrierefrei ausblenden
Die wahrscheinlich am häufigsten genutzte CSS-Anweisung ist display:none. Damit kann man alle Sachen wegzaubern, die im Layout stören. Aber auch Screenreader sehen dann nichts mehr davon. Das ist nicht immer sinnvoll.
Weiterlesen
23. Juni 2020
Gutenberg Farb-Palette und Theme-CSS verbinden über WP-SCSS
Ein großes Problem beim Entwickeln von Themes und Child-Themes ist das Handling der Theme-Farben. Sie existieren in zwei voneinander getrennten Welten. Einmal in Gutenberg (PHP) und einmal in der style.css (CSS).
Weiterlesen
15. Juni 2020
Card-Design mit Gutenberg
Anlass zu diesem Beitrag war eine Frage in einer Facebook-Gruppe. Die Frage war: Kann man ein Card-Design aus Bild und Text mit Gutenberg-Bordmitteln umsetzen? Ja, das geht sehr gut.
Weiterlesen
3. Juni 2020
„Wireframe-CSS“: WordPress als Prototyping-Tool
Wenn wir ein neues Kunden-Projekt starten, fangen wir bei den Inhalten an. Wir konzentrieren uns erst Mal ganz auf die Struktur der Website. So ganz ohne Design und bunte Bildchen.
Weiterlesen
29. Mai 2020
Schrift-Größen in vw (viewport-width) angeben
Neben Pixel, em und rem gibt es noch eine andere Einheit, mit der man Schriftgrößen definieren kann. Die Einheit (vw) bezieht sich auf die Größe des Browserfensters. Im Zusammenhang mit mobilen Geräten würde man statt Browserfenster Bildschirmbreite sagen.
Weiterlesen
20. April 2020
CSS-Klasse über die Browser-Konsole herausfinden
Manchmal möchte man eine Kleinigkeit per CSS bearbeiten – die Überschrift soll ein bisschen kleiner werden, irgendwo stört eine Farbe oder man möchte ein Element verbergen. Das sind alles Dinge, die man einfach und schnell über CSS im Customizer umsetzen kann.
Weiterlesen
CSS WordPress
Weiterlesen
Das Box-Modell und „box-sizing: border-box“
Bestimmt hast du den Begriff „Box-Model“ schon einmal gehört. Dieses Stichwort beschreibt ein bestimmtes Standard-Verhalten von HTML-Elementen. Dieses Verhalten kann zu Problemen im Layout führen.
11. April 2020
Den Seiten-Titel in WordPress per CSS ausblenden
Auf WordPress-Seiten und -Beiträgen erscheint automatisch ganz oben ein Titel. Auch Archive haben so einen Titel. Da steht dann so etwas wie „Kategorie: Allgemein“ oben auf der Archive-Seite.
In manchen Fällen stört dieser Seitentitel.
27. März 2020
Redesign Netzialisten mit CSS Grid
Ich hab mal wieder die Netzialisten umgebaut. Das neue Design soll es den Besuchern ermöglichen, leichter von einem Thema zum anderen zu wechseln. Sie sollen sich besser „horizontal“ im Blog bewegen können.
Die klare, textzentrierte Optik sollte dabei erhalten bleiben. Dadurch beschränken sich die Gestaltungsmittel auf Typografie, Weißräume und Farbe.
Weiterlesen