06.03.2014

Wasserzeichen - birds - Webvorlage

Hier geht es um die Web-Version der Variante "birds" der Vorlage Wasserzeichen (Watermark).

So sieht sie aus

Ungeöffnet oben:

Geöffnet unten:


So erkennt man sie im Quelltext

Vorlage:
/* - - - - - - - - - - - - - - - - - - - - - - - - - -
Blogger Template Style
Name:     Watermark
Designer: Josh Peterson
URL:      www.noaesthetic.com
- - - - - - - - - - - - - - - - - - - - - - - - - - */

Variante:
<body class='loading variant-birds'>

Der Eintrag der Klasse verschwindet jedoch, wenn man Wesentliches an der Vorlage ändert, wie etwa das Hintergrundbild.

Besondere Grundeinstellungen der Variante

  • Äußerer Hintergrund: Hintergrundfarbe und sehr heller Gradient darüber, der einen Körnungs- und leichten Marmorierungseffekt für die Farbe bewirkt
    body {
    background: #c0a154 url(//www.blogblog.com/1kt/watermark/body_background_birds.png) repeat scroll top left;
    }
  • Oberer Hintergrundbereich (Schicht über äußerem Hintergrund): Transparentes Bild mit fliegenden Vögeln oben rechts auf transparenter Hintergrundfarbe
    .body-fauxcolumns .cap-top {
    background: transparent url(//www.blogblog.com/1kt/watermark/body_overlay_birds.png) no-repeat scroll top right;
    }
  • Tabs: Brechen nicht in nächste Zeile um, wenn sie nicht in die erste passen, sondern erscheinen dann einfach nicht. Grund dafür ist das folgende Kommando:
    .tabs-inner .widget ul {
    max-height: 34px;
    }
  • Posts: Jeder Post wird einzeln angezeigt.
    Sehr heller Gradient über dem Hintergrund und eine gepunktete Rahmenlinien
    .post-outer {
    background: url('//www.blogblog.com/1kt/watermark/post_background_birds.png') repeat scroll left top transparent;
    border: 1px dotted #CB9;
    }
  • Fußzeile: Heller Gradient über dunkler Hintergrundfarbe - geht über gesamte Screenbreite
    .footer-outer {
    background: url('//www.blogblog.com/1kt/watermark/body_background_navigator.png') repeat scroll left top #300;
    }


Ute Ziemes, bodyvariant.blogspot.de,

Keine Kommentare:

Kommentar veröffentlichen