/* Total revidierte CSS-Datei. Teile übernommen von Gerhard Siegwart,
welchem ich danke! Ursprüngliche Datei hatte Copyright Johann-Christian
Hanke. Thomas Birk, Im Marstall 10s, 71634 Ludwigsburg
2011-07-03 zunächst kleine Änderungen für index.html
color für body (vorläufig mal weiß)
2011-07-31 Korrekturen für tag
, weiteres siehe unten
2011-07-31 ACHTUNG! Keine Regel ohne Ausnahme! Deshalb vererbt
leider nicht alle seine Eigenschaften, und dies
teils unterschiedlich je nach Norm CSS1 CSS2 ... und
damit auch je nach Browser. Lösungen z.B.:
a) Eben nochmal ein zentrales Format definieren.
b) Parameter für Eigenschaft "inherit".
c) Ungünstiger: Parameter für Eigenschaft "!important".
Diese wird nicht von allen Browsern erkannt.
2011-08-01 Neuorganisation der Formate
2011-08-05 Bewegung des sluts um 1px entfernt
2011-09-20 Blackmetalcursor auskommentiert
2011-09-21 verbesserte Dokumentation
2012-06-02 Validator meckert an table.aktuell font-stretch:expanded
herum, OBWOHL Eigenschaft auskommentiert wurde!
deshalb nun hier: font-stretch:expanded; NICHT in CSS 2.1
*/
/* ========== 0. Univeralselektor ========== (noch) nicht verwendet */
/* ========== 1. Tag-Typformate ========================== */
/* gemeinsame Angaben durch Auflistung mit Komma möglich */
body {
/* a) sicher vererbte Eigenschaften: */
color:#ffffff;
font-family: "comic sans ms", Verdana, Arial, sans-serif;
/* b) na ja, könnte vererbt werden und falls Bild "transparent" ist ...*/
background-color: black;
/* c) bekannte und "offiziell" NICHT (immer) vererbte Eigenschaften: */
background-image: url(bg_body_v.jpg); /* Verz. wie css-Datei! */
background-repeat: no-repeat;
background-position: center top;
margin: 0;
}
/*---------- Korrektur von Vererbungsmängeln ----------*/
table {
color:#ffffff; /* offensichtlich nicht immer von body geerbt */
}
/* ********************************************************** */
/* - - - - - weiteres für die Webseitengestaltung - - - - - - */
/* Linie interessant gestaltet von Gerhard Siegwart! */
hr {
border-style: solid;
border-width: 1px;
border-color: #003084;
/* width: 85%; 2011-07-31 abgeschaltet weil
auch ganz
weit rechts hinreichen soll */
/* margin-left: 0px; 2011-07-31 überflüssig, weil Unterlassung */
/* text-align: left; 2011-08-01 "Schreibkultur"-Unterlassungswert */
}
h1 {
text-align:center; /* will ich immer in der Mitte haben */
}
/* alle Bilder zentriert, wo sie auch immer sind
Beschreibungstext auch zentriert */
img {
text-align:center;
background-position:center;
}
/* ========== 2. Univeralklassen-Formate = class ========== */
/* Universalattribute für alle tags gemeinsam = Vorsicht! */
/* Klassen können dann auch noch kombiniert werden ... */
/* .universal {...}
/* ========== 3. Typklassen-Formate = tag + class ========== */
/* sicherer tag-spezifisch + ebenfalls mit class="..." auszuweisen */
/*----- die Menüknöpfe in einer Menütabelle ----- */
table.knopf {
text-align:center;
text-decoration:none;
border:none;
color:inherit;
background-color:inherit; /* sicher ist sicher */
}
/* Menüknopf soll nur von Menütabelle erben, daher siehe unten.
(Erspart "class=" bei DOM-untergeordneten html-tags)
a.knopf {
text-align:center;
text-decoration:none;
display:block;
width:100px;
border:1px solid #990000;
padding:3px;
margin:1px;
font-family:verdana,arial,helvetica,sans-serif;
font-size:14px;
font-weight:bold;
color:#ffffff;
background-color:#006600;
}
*/
/*----- für Ausgabe tagesaktuell ----- */
table.aktuell {
text-align:center;
/* text-decoration:underline,blink; 2015-11-25 aufgrund validator */
font-size:larger;
font-weight:bold;
letter-spacing:4px;
border:20px solid #990000;
border-style:ridge;
color:inherit;
background-color:inherit; /* sicher ist sicher */
}
/* ========== 4. Attributselektoren NUR ab CSS2 ========== */
/* daher nicht verweden, z.B. a[href="diesunddas"] {...} */
/* ========== 5. Pseudoklassen ========== */
/* 5.1. Link-Pseudoklassen, Element:link und Element:visited */
/* 5.2. Dynamische Pseudoklassen, Element:hover :focus :active */
/* Definitionsreihenfolge beachten! :link :visited :hover :focus :active */
/* dazu andere Meinung: :link :visited :focus :hover :active */
/* allgemeine Verweise irgendwo */
a:link {
color:#0000ff;
background-color:#000000;
}
a:visited {
color:#008800;
background-color:#000000;
}
a:hover {
color:#00ff00;
background-color:#000000;
}
a:active {
color:#ff0000;
background-color:#000000;
text-decoration: underline;
}
/* 5.3. Struktur-Pseudoklassen */
/* 5.4. Verweisziel-Pseudoklasse */
/* 5.5. Sprach-Pseudoklasse */
/* 5.6. Negations-Pseudoklasse */
/* 5.7. Pseudoelemente */
/* ========== 6. Kombinatoren zu obigen Klassen ========== */
/* blank > + - ~ möglichst nur blank verwenden, da eher CSS2.x */
/* *************************************************************** */
/* ********** Regelungen für allgemeines Seitenfußmenü *********** */
/* *************************************************************** */
/* Menüknopf eindeutig und nur in Knopf-Tabelle */
/* als Kind von */
table.knopf a {
text-decoration:none;
display:block;
width:100px;
border:1px solid #990000;
padding:3px;
margin:1px;
font-family:verdana,arial,helvetica,sans-serif;
font-size:14px;
font-weight:bold;
text-align:center;
color:#eeeeee;
background-color:#006600;
}
/* :link erbt und :visited erbt auch von a */
/* :focos und :hover können soweit einfach gleich gesetzt werden */
/* der alte NS 4.x macht folgendes a:hover nicht! Egal.*/
/* Angabe nur der nicht von vererbten Eigenschaften sinnvoll */
table.knopf a:focus, table.knopf a:hover {
/* text-decoration:none; */
/* display:block; */
/* width: via DOM unter table.knopf def. */
border:1px solid #dd0000;
padding:2px; /* 2011-08-05 reduziert um 1px, s.u. */
/* margin:1px; */
/* font-family:verdana,arial,helvetica; */
font-size:15px; /* etwas Bewegung auf der Seite! */
/* 2011-08-05 NEIN, so wichtig ist die Schlußzeile doch nicht */
/* font-weight:bold; */
/* text-align:center; */
color:#ffffff;
background-color:#009900;
/* cursor:url("http://www.megapolis.name/gem/teufel.cur"),default; */
/* MERKSATZ: Wenn uri-Angabe, dann noch Komma UND eine weitere
Angabe! So w3org, fast alle Literatur war leider falsch! */
/* cursor:url('http://www.megapolis.name/gem/teufel.cur'),default;
wahlweise " oder ' möglich */
}
table.knopf a:active {
/* text-decoration:none; */
/* display:block; */
/* width: via DOM unter div.knopf def. */
border:1px solid #dd0000;
/* padding:3px; bei drücken doch mehr Bewegung */
/* margin:1px; */
/* font-family:verdana,arial,helvetica; */
font-size:15px;
/* font-weight:bold; */
/* text-align:center; */
color:#ff0000;
background-color:#990000;
/* cursor:url("http://www.megapolis.name/gem/teufel.cur"),default; */
/* MERKSATZ: Wenn uri-Angabe, dann noch Komma UND eine weitere
Angabe! So w3org, fast alle Literatur war leider falsch! */
/* cursor:url('http://www.megapolis.name/gem/teufel.cur'),default;
wahlweise " oder ' möglich */
}
/* *************************************************************** */
/* ********** Regelungen für grauen Knopf Archivanwahl *********** */
/* *************************************************************** */
/* Menüknopf eindeutig und nur in Knopf-Tabellenzeile! */
table.arcknopf a {
text-decoration:none;
display:block;
width:100px;
border:1px solid #990000;
padding:3px;
margin:1px;
font-family:verdana,arial,helvetica,sans-serif;
font-size:14px;
font-weight:bold;
text-align:center;
color:#000000;
background-color:#808080; /* = grey; */
}
table.arcknopf a:focus, table.arcknopf a:hover {
/* text-decoration:none; */
/* display:block; */
/* width: via DOM unter table.knopf def. */
border:1px solid #dd0000;
padding:2px; /* 2011-08-05 reduziert um 1px, s.u. */
/* margin:1px; */
/* font-family:verdana,arial,helvetica; */
font-size:15px; /* etwas Bewegung auf der Seite! */
/* 2011-08-05 NEIN, so wichtig ist die Schlußzeile doch nicht */
/* font-weight:bold; */
/* text-align:center; */
/* color:#000000; vererbt */
background-color:#CDCDCD; /* hellgrau = gainsboro */
/* cursor:url("http://www.megapolis.name/gem/teufel.cur"),default; */
/* MERKSATZ: Wenn uri-Angabe, dann noch Komma UND eine weitere
Angabe! So w3org, fast alle Literatur war leider falsch! */
/* cursor:url('http://www.megapolis.name/gem/teufel.cur'),default;
wahlweise " oder ' möglich */
}
table.arcknopf a:active {
/* text-decoration:none; */
/* display:block; */
/* width: via DOM unter div.knopf def. */
border:1px solid #dd0000;
/* padding:3px; bei drücken doch mehr Bewegung */
/* margin:1px; */
/* font-family:verdana,arial,helvetica; */
font-size:15px;
/* font-weight:bold; */
/* text-align:center; */
color:#000;
background-color:#FFF;
/* cursor:url("http://www.megapolis.name/gem/teufel.cur"),default; */
/* MERKSATZ: Wenn uri-Angabe, dann noch Komma UND eine weitere
Angabe! So w3org, fast alle Literatur war leider falsch! */
/* cursor:url('http://www.megapolis.name/gem/teufel.cur'),default;
wahlweise " oder ' möglich */
}
/* ========== 7. HTML-tag-ID-Selektoren ========== für Einzelfälle */
/* ziemliche Schreibarbeit, besser die intelligtenten Vererbungs-
regeln verweden */