So sieht sie aus
Ungeöffnet oben:
So erkennt man sie im Quelltext
Vorlage:/* - - - - - - - - - - - - - - - - - - - - - - - - - -
Blogger Template Style
Name: Simple
Designer: Josh Peterson
URL: www.noaesthetic.com
- - - - - - - - - - - - - - - - - - - - - - - - - - */
Variante:
<body class='loading variant-literate'>
Der Eintrag der Klasse verschwindet jedoch, wenn man Wesentliches an der Vorlage ändert, wie etwa das Hintergrundbild.
Besondere Grundeinstellungen der Variante
- Äußerer Hintergrund: Sich nach unten hin wiederholendes Bild von einem Regal mit Büchern. Das Bild ist in zwei Bereichen eingetragen, die gemeinsam wie einer aussehen.
body { background: #513831 url(//themes.googleusercontent.com/image?id=1KH22PlFqsiVYxboQNAoJjYmRbw5M4REHmdJbHT5M2x9zVMGrCqwSjZvaQW_A10KPc6Il) repeat scroll top center /* Credit: luoman (http://www.istockphoto.com/googleimages.php?id=11394138&platform=blogger) */;
}
.body-fauxcolumn-outer .cap-top {
position: absolute;
z-index: 1;
height: 400px;
width: 100%;
background: #513831 url(//themes.googleusercontent.com/image?id=1KH22PlFqsiVYxboQNAoJjYmRbw5M4REHmdJbHT5M2x9zVMGrCqwSjZvaQW_A10KPc6Il) repeat scroll top center /* Credit: luoman (http://www.istockphoto.com/googleimages.php?id=11394138&platform=blogger) */;
} -
Header: Beige-grüne Farbe auf der ein grauer Gradient (teiltransparentes Hintergrundbild) liegt, der dafür sorgt, dass die Header-Farbe im oberen Bereich etwas heller aussieht.
.header-outer {
background: #ccb666 url(//www.blogblog.com/1kt/simple/gradients_light.png) repeat-x scroll 0 -400px;
} - Tabs: Die Rahmenlinien nach rechts sind die Trennlinien zwischen den Tabs.
.tabs-inner .widget li a {
display: inline-block;
padding: .6em 1em;
font: normal normal 16px Georgia, Utopia, 'Palatino Linotype', Palatino, serif;
color: #998877;
border-left: 1px solid #fff9ee;
border-right: 1px solid #eee5dd;
} - Posts: Einzelne Tage (.date-outer) sind dadurch voneinander abgegrenzt, dass sie ein Datum drüber haben. Einzelne Posts sind dadurch abgegrenzt, dass der Hintergrund der Post-Fußzeilen anders gefärbt ist als der Hintergrund des Post.
- Sidebar: Linke Rahmenlinie als Trennlinie zum Postbereich.
.fauxcolumn-right-outer .fauxcolumn-inner {
border-left: 1px solid #eee5dd;
}
Ute Ziemes, bodyvariant.blogspot.de,
Keine Kommentare:
Kommentar veröffentlichen