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-bubblegum'>
Der Eintrag der Klasse verschwindet jedoch, wenn man Wesentliches an der Vorlage ändert, wie etwa das Hintergrundbild.
Besondere Grundeinstellungen der Variante
- Äußerer Hintergrund: Pinke Hintergrundfarbe mit hellgrauem Gradient darüber
body {
background: url('//www.blogblog.com/1kt/watermark/body_background_bubblegum.png') repeat scroll center top #E13;
}
- Oberer Hintergrund: Pinke Hintergrundfarbe mit zwei Grautönen gestreiftem Gradienten darüber, der sich seitlich ständig wiederholt
.body-fauxcolumns .cap-top {
margin-top: 30px;
background: url('//www.blogblog.com/1kt/watermark/body_overlay_bubblegum.png') repeat-x scroll left top #E13;
height: 400px;
} - Tab-Leiste: Hintergrund, Rahmen, Schatten, Endenbilder
Gelboranger Hintergrund, breite Rahmenlinien oben und unten sowie Schatten
.tabs-inner .PageList {
margin-left: -11px;
margin-right: -11px;
background-color: #FD9;
border-top: 3px solid #FFF;
border-bottom: 3px solid #FFF;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
}
Linker Tab-Pfeil nach rechts und Beschränkung auf eine einzige Tab-Zeile (max-height)
.tabs-inner .widget ul {
padding: 2px 25px;
max-height: 34px;
background: url('//www.blogblog.com/1kt/watermark/tabs_background_left_bubblegum.png') no-repeat scroll left center transparent;
}
Rechter Tab-Pfeil nach links
.tabs-inner .PageList .widget-content {
margin: -3px -11px;
background: url('//www.blogblog.com/1kt/watermark/tabs_background_right_bubblegum.png') no-repeat scroll right center transparent;
} - Posts: Jeder Post wird einzeln angezeigt.
Hellgelbe Hintergrundfarbe, weiße dicke Rahmenlinien sowie Schatten
.post-outer {
background: none repeat scroll left top #FFFFE5;
border: 6px solid #FFF;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1);
} - Fußzeile: Heller Gradient über Rosa
.footer-outer {
background: url('//www.blogblog.com/1kt/watermark/body_background_birds.png') repeat scroll left top #FCC;
}
Ute Ziemes, bodyvariant.blogspot.de,
Keine Kommentare:
Kommentar veröffentlichen