Entscheidungseinträge
| Ziel | Unterziel | neu... | statt... | sowie... |
| Hintergrund | Bild gewählt | |||
| Blogbreite | 980px | 930px | ||
| Layout | 2 Sidebars | 1 | ||
| Erweitert | ||||
| Seitentext | 17px | 15px | ||
| Links | Linkfarbe | #110650 | #000000 | x |
| Blogtitel | #110650 | #ffffff | fett | |
| Tab-Text | Ausgewählte Farbe | #8e8e8e | #000000 | fett |
| Tab-Hintergrund | Hintergrundfarbe | transparent | #f1f1f1 | |
| x | Ausgewählte Farbe | #000002 | #ffffff | |
| Post-Titel | 20px | 18px | fett | |
| Gadgets | ÄNDERUNGEN funktionieren nur bei Farbe | |||
| Footer | Schriftfarbe | #e5e4f3 | #e9e9e9 | xxx |
Gadget-Titel | #e5e4f3 | #b4b4b4 | ||
| Footer-Links | Linkfarbe | #1700a0 | #f9d4ff | |
Besuchte Links | #020200 | #bf8ec6 | ||
CSS hinzufügen
/*EIGENES CSS ANFANG*/
/* - - - - - - - -
Header
- - - - - - - - -*/
/*Header: 2. Bild im Container hinter dem schmaleren Headerbild rechts eingeordnet*/
.header-outer {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTnuN2cGV8byuU2_cJp6MiNGw91b46GwTm3fUN3xPZcbKREKZHrwhqWssKc5X7mXpMp4IFonPKWsBPQy5wUYHqun5-FdHb2PjWUgzFKabbhi5qtl26n3e5dkkwxC9lu20RHJRiFG_dKx8/s1600/astronaut_0003.gif") no-repeat scroll top right #02010C;
}
/* - - - - - - - -
Sidebars
- - - - - - - - -*/
/*Sidebars: Überschriften vergrößert*/
#sidebar-left-1 h2, #sidebar-right-1 h2, #footer-1 h2 {
font-size:110%;
}
/*Sidebars: Links fett gemacht*/
#sidebar-left-1 a, #sidebar-right-1 a {
font-weight:600;
}
/* - - - - - - - -
Blog-Archiv
- - - - - - - - -*/
/*Blog-Archiv-Titel: weiter nach links gestellt*/
#BlogArchive1.widget.BlogArchive h2 {
margin-left: -18px;
}
/*Blog-Archiv-Post-Titel: weiter nach links gestellt*/
.BlogArchive #ArchiveList ul li {
text-indent: -30px;
margin: 0em;
}
/*Blog-Archiv: div Schachteln weiter nach links gestellt und ggf. verbreitert, um Post-Titel-Zerstückelungen zu minimieren*/
#BlogArchive1.widget.BlogArchive {
margin-left:5px;
}
#BlogArchive1.widget.BlogArchive .widget-content {
width:110%;
margin-left:5px;
}
.BlogArchive #ArchiveList ul.posts li {
padding-left: -20px;
}
.BlogArchive #ArchiveList ul.posts, .BlogArchive #ArchiveList li {
margin-left:-20px;
}
.BlogArchive #ArchiveList li.archivedate.expanded {
margin-left:-10px;
}
/* - - - - - - - -
Posts
- - - - - - - - -*/
.post-outer {
margin: 0px -20px 10px;
}
.post-body {
margin-top: -10px;
line-height: 1.2;
}
.post-footer {
margin: 0.2em 0px 0px;
line-height: 1;
border-top: 3px dotted #C2B4CD;
padding-top: 10px;
}
.jump-link {
margin: 5px 0px;
font-weight: 600;
}
code {
font-size: 90%;
}
/* - - - - - - - -
Elemente allgemein
- - - - - - - - -*/
hr {
color:transparent;
border-top: 3px dotted #C2B4CD;
margin-bottom: 0px;
}
/* - - - - - - - - - - - -
Zwischen Posts und Footer
- - - - - - - - - - - - */
#blog-pager {
margin-bottom: -20px;
}
.blog-feeds {
margin:50px 0px 50px 0px;
text-align:center;
font-weight:600;
}
.post-feeds {
margin:-65px 0px 50px 0px;
text-align:center;
font-weight:600;
}
.main-inner {
padding-bottom:0px;
}
/* - - - - - - - -
Footer
- - - - - - - - -*/
/*Footer: Hintergrund und Schatten geändert, aber nicht Background-None eingesetzt*/
.footer-outer {
background-color: #E1E2F9;
-moz-border-radius: 10px 10px 10px 10px
-webkit-border-radius: 10px 10px 10px 10px
-ms-border-radius: 10px 10px 10px 10px
-goog-ms-border-radius: 10px 10px 10px 10px
-o-border-radius: 10px 10px 10px 10px
border-radius: 10px 10px 10px 10px;
-moz-box-shadow: 1px 1px 15px #0B0229 inset;
-webkit-box-shadow: 1px 1px 15px #0B0229 inset;
-ms-box-shadow: 1px 1px 15px #0B0229 inset;
-goog-ms-box-shadow: 1px 1px 15px #0B0229 inset;
-o-box-shadow: 1px 1px 15px #0B0229 inset;
box-shadow: 1px 1px 15px #0B0229 inset;
}
/*Footer: Schrift fett gemacht*/
footer {
font-weight: 600;
}
/*Footer: Titel näher am Content*/
footer h2 {
margin-bottom: -5px;
}
/*Footer: Gadget Blogliste: Inhalt soll ganze Footer-Breite nutzen*/
.blog-list-container .blog-content {
width: 100%;
}
#HTML1.widget.HTML h2.title {
font-size: 90%;
text-align: center;
margin-bottom: 5px;
}
#HTML1.widget.HTML .widget-content {
font-size: 80%;
margin-bottom:-29px;
}
/*Attribution1: um 40px näher an HTML1*/
#Attribution1.widget.Attribution {
margin-top: 0px;
margin-bottom:5px;
line-height: 1.0;
font-size: 80%;
}
/*HTML2: Nach-Oben-Script - - - Raumeinnahme entfernt
HTML3: Newer-Older-Link-Posttitel-Script - - - Raumeinnahme entfernt*/
#HTML2.widget.HTML, #HTML3.widget.HTML {
display: none;
}
/* - - - - - - - -
Widgets allgemein
- - - - - - - - -*/
.widget {
line-height: 1.2;
}
/*EIGENES CSS ENDE*/
Zum HTML und Style der Tabelle
Um wenig Arbeit damit zu haben, das Grundgerüst für die Tabelle zu erstellen, habe ich einen Tabellengenerator genutzt, der den Tabellen-Code für mich erstellte, den ich hier im HTML-Modus einfügen konnte. Da gibt's den Generator: Virtualsystem
Die Breite der Tabelle musste ich mit einem Style-Kommando begrenzen und habe das oberhalb des eigentlichen Post-Inhalts gemacht. Ich habe das per Breitenbegrenzung und Word-Break-Kommando für die einzelnen Spalten gemacht. Außerdem habe ich den Text innerhalb der Spalten oben ausgerichtet und ihn etwas verkleinert. Ebenfalls kommandiert habe ich, dass inhaltsleere Zellen angezeigt werden. Auch die Hintergrundfarben der zwei hervorgehobenen Zeilen habe ich da kommandiert, wozu ich an die entsprechenden Zeilen je eine Class vergeben musste. Vorteil gegenüber der Lösung, das Style-Kommando gleich an die Zeilen zu setzen: Falls ich die Class öfter nutzen will und das Stylekommando aus dem Post nehmen und unter "CSS hinzufügen" eintragen will, steht hier schon mal die Class dran und ich muss die Zeilen dafür nicht aufspüren.
Ob ich die Kommandos auch in weiteren Tabellen haben will und ob ich überhaupt noch mal eine Tabelle einstelle, weiß ich noch nicht. Falls ja, würde ich auch diese Kommandos dann in "CSS hinzufügen" übertragen, damit ich künftig nicht mehr dran denken muss, Style-Kommandos für Tabellen zu definieren.
Einen Teil davon - die Breite etwa - hätte ich wahrscheinlich schon im Generator angeben können, aber da wusste ich noch nicht, wie breit ich sie haben will.
0 Kommentare:
Kommentar veröffentlichen