CSS-Stylesheet
Hier finden Sie zahlreiche Tricks, um Ihr Webprojekt mit CSS-Code auf Vordermann zu bringen.
Wir empfehlen Ihnen den Einsatz eines Child-Themes – damit sind Sie sicher, dass Ihre Anpassungen bei einem Theme-Update nicht überschrieben werden. Wie Sie ein Child-Theme erstellen, erfahren Sie im Beitrag «Ein Child-Theme anlegen – ein Must im Webdesign».
Das Button-Modul des Divi-Themes enthält keine Option, um seine Höhe einzustellen. Aber in manchen Fällen möchten Sie diese vielleicht anpassen, damit der Button auf Ihrer Seite besser zur Geltung kommt. Hier zeigen wir Ihnen, wie Sie die Höhe des Divi-Buttons mittels CSS-Code anpassen können. Auch für die Button-Breite haben wir einen Hack parat.
Das Internet lebt von Bildern – wahrlich eine Binsenwahrheit. Aber die Bilder lassen sich leicht animieren. So dass sie etwa beim Laden einer Seite automatisch ein- oder auszoomen. Wie einfach das geht, zeigen wir Ihnen heute.
Das Divi-Theme kommt mit einem patenten Login-Modul daher. Doch es lässt sich nicht komplett stylen: So sind etwa horizontal angeordnete Anmeldefelder von Haus aus nicht möglich. Es sei denn, Sie verwenden unseren CSS-Trick.
Bilder auf der Website zu verwenden, ist eine einfache Übung. Heute versehen wir die dargestellten Bilder zusätzlich mit einem schönen Innenrahmen. So was habe ich unlängst auf der Website einer Kollegin entdeckt – sieht sehr hübsch aus. Musste ich gleich nachbauen.
Die Formularfelder des Kontaktformular-Moduls im Divi-Theme werden normalerweise innerhalb der eigentlichen Felder angezeigt. Doch das lässt sich ändern: Die Feldbezeichnungen können auch links der Eingabefelder platziert werden. Wie das geht, zeigen wir Ihnen heute,
Das Galerie-Modul des Divi-Themes lässt sich recht einfach mit einem «Load More»-Button ergänzen. Wie das funktioniert, zeigen wir Ihnen im heutigen Trick.
Bilder müssen nicht immer einfach nur so gerade dastehen. Ein kleiner Dreh kann ansprechend wirken. Dabei ist es nicht einmal nötig, das Originalbild im Photoprogramm zu bearbeiten. Ein wenig CSS-Code hilft Ihnen.
Divi-Module lassen sich recht einfach mit einem kleinen Textbanner – einem Ribbon – darstellen und hervorheben. Wir zeigen Ihnen heute, wie Sie solche Ribbons mittels CSS-Code erstelln können. Sie können aus 15 Varianten wählen.
Das hr-Element des HTML-Codes ergibt normalerweise eine Trennlinie, welche grau und auf der gesamten Anzeigebreite dargestellt wird. Doch dieser Horizontal Ruler hr lässt sich auch als Akzent einsetzen. Im heutigen Tipp ein paar Beispiele.
Mit dem HTML-Element button können Sie ganz einfach Schaltflächen erstellen. Mit der Zugabe von noch ein wenig CSS-Code, werden die Buttons überdies richtig schmuck. Drei Gestaltungsmöglichkeiten zeigen wir Ihnen in diesem Beitrag.
Fluid Typography ist ein Designansatz, bei dem die Grösse, der Zeilenabstand und die Proportionen von Text automatisch an die Grösse der Anzeige oder des Viewports angepasst werden, auf dem er angezeigt wird. Heute möchten wir Ihnen Fluid-Typography vorstellen.
Der Standardfooter des Divi-Themes verfügt über eine Creditleiste. Deren Breite ist abhängig von der Breite der Website und wird stets mit den identischen Massen dargestellt. Falls Sie die Credit-Leiste selber definieren möchten, können Sie dies ganz einfach tun.
Keine Inhalte gefunden.
Werbung
