Twenty Twelve Artikel-Hintergrund-Farbe ändern

Will man beim Theme Twenty Twelve die Artikel-Hintergrund-Farbe ändern, muss man nur eine kleine Änderung in der style.css vornehmen. Die Artikel bzw. Beiträge können so im Look and Feel voneinander getrennt werden und das User-Erlebnis der Seite wird angenehmer.

Twenty Twelve Artikel-Hintergrund-Farbe ändern – Child Theme

Am besten ist es dafür ein Child-Theme zu erstellen, was garnicht kompliziert ist. Hier ist eine kurze und übersichtliche Anleitung zur Erstellung eines Twenty-Twelve Child-Themes…

Hier findest Du gleich vollständige Twenty Twelve Child-Themes als Download…

Twenty Twelve Artikel-Hintergrund-Farbe ändern

Nachdem wir das Child-Theme angelegt haben, brauchen wir nur noch den folgenden Code in das Child-Theme einzufügen:

1
article {background: #FFFFFF; padding: 5px;}

Dabei bestimmt man mit #FFFFFF die Hintergrundfarbe (wähle hier Deinen Farbcode…) und mit padding wird der Seitenabstand des Textes zum Artikelrand bestimmt. Den Seitenabstand (padding) vergrößert man hiermit von 0 auf 5 Pixel, was dazu führt, das die Schrift nicht direkt am Rand klebt, sondern professionell eingerückt ist. Das verbessert die Lesbarkeit.

Twenty Twelve Artikel Hintergrund Farbe ändern

Twenty Twelve Artikel Hintergrund Farbe ändern


In unserem Beispiel ist nun der Schriftkontrast verbessert, denn dunkle Schrift auf weißem Hintergrund ließt sich besser als auf rotem oder farbigen Hintergrund.

Hast du Fragen oder Gedanken zum Ändern der Farbe im Artikelhintergrund des Themes Twenty Twelve? Schreibe einen Kommentar…

3 Gedanken zu „Twenty Twelve Artikel-Hintergrund-Farbe ändern

  1. Greg

    … wegen einfügen von Code z.B. im Childtheme z.B. im style.css , ist da eigentlich egal welchen code ( z.B. die von dir angebotenen codeschnipsel ) ich in welcher position, reihenfole eintrage ? oder gibt es da eine hirarchie ?

    Antworten

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>