- text-decoration: none; Entfernt den Unterstrich des Links
- margine: 3px; Abstand zwischen den Boxen
- Inline-Elemente können nicht mit Höhe und Breite ausgestattet werden.
- Inline-Elemente sind: <a> Hyperlink, <span> Spanne, Bereich
- im Body passiert alles, extrem wichtig!
- Body als Box!
- Standardmäßig: füllt ein Blog alles aus, wenn ich keine konkrete Angabe gemacht habe
- text-align: justify; Blocksatz
- Browser machen automatisch einen Abstand, ärgerlich!
- margin: 0; Abstand vom Browser zurückgesetzt, wichtig bei genauer Bemaßung!
- bei der Vergabe einer absoluten Breite paßt sich nichts mehr an! Man orientiert sich an 1000px (1024px).
- bei prozentuellen Werten paßt es sich an! Schwieriger!
- Standardmäßig ist die Box linksbündig (z. B. Spiegelseite www.spiegel.de, Größe der Box 900px, häufige Technik: sichtbare Bereich der Seite wird zentiert)
- sichtbare Bereich der Seite wird zentiert mit Hilfe von einem div-Bereich <div></div>
- Boxen inneinander interagieren miteinander, z. B. wenn body und div-Bereich beide einen margin haben, wird der margin-Wert (Außenabstand) gedoppelt
- Standardmäßig: immer alles im body auf 0 setzten
- Alles mittig: im div-Bereich { margin: 1em auto;} Wichtig!
Die Leinwand (Div-Wrapper) mit absoluter Breite
- Festbemaßte Grenzen: z. B. im
div {min-width: 480px; min-width: 1280px;} - Viewpoint von 1000px
- Mindesthöhe definieren, dann wächst der DIV-Bereich bei mehr Inhalt mit
div {min-width: 480px; min-width: 1280px;}
- Alle %- Abstände beziehen sich auf die Breite
- Bei Prozent-Angaben immer eine feste Größe im Eletenelement HEAD oder BODY-Element angeben html {height: 100%;}, body {height: 100%;}
Beispiel
<head>
<style type="text/css">
li {color: #0000FF;}
.gerade {background-color: #ccc; color: red;}
.comicsans {font-family: "Comic Sans MS";}
.sg48 {font-size: 48px;}
.sg24 {font-size: 24px;}
.sg18 {font-size: 18px;}
.initial {color: #FF7F00; font-size: 120px;}
</style>
<head>
<body>
<li class="comicsans sg24">Ungerade</li>
</head>
Selektoren
- Elementselektoren (Typselektor, Tagselektor): body, div, p, a,
- Klassenselektoren: .irgentwas (es können mehrere Selekoren vergeben werden, Klasse!)
- id-Selektoren: #name (gibt es nur einmal und hat den höchste Wert, überschreibt alles!)
Keine Kommentare:
Kommentar veröffentlichen