Hechtnetz - HTML-Kurs - CSS: CSS-Angaben (Teil 1)

Start > Einleitung > CSS einbinden > CSS-Angaben 1 > CSS-Angaben 2 > Phase5

CSS-Angaben (1)

CSS-Angaben - Teil 1
Schriftformatierungen	Abstände, Ränder, Ausrichtung	Rahmen, Innenabstände

Schriftformatierungen (Auszüge)

Steht im HTML-Container zu formatierender Text, können Sie die folgenden Angaben verwenden.

CSS-Angabe	Wert	Bedeutung
`font-family`	Schriftartnamen (*)	Schriftart
`font-style`	`italic` (kursiv), `normal` (ohne)	Schriftstil
`font-size`	numerische Angabe (**)	Schriftgröße
`font-weight`	`bold` (fett), `normal` (normal) (***)	Schriftgewicht
`text-decoration`	`none` (keine), `underline`, (unterstrichen), `line-trough` (durchgestrichen)	Textauszeichnung
`text-transform`	`capitalize` (Wortanfänge Als Großbuchstaben), `uppercase` (NUR GROßBUCHSTABEN), l`owercase` (nur kleinbuchstaben), `none` (ohne)	Textumwandlung
`color`	Farbangabe	Schriftfarbe
`font`	Angaben zu `family`, `style`, ... (****)	mehrere Angaben zur Schrift

(*) Mehrere Schriftarten sind möglich. Trennen Sie die Namen durch Komma, sie werden nacheinander bearbeitet. Gegen Sie zum Abschluss die Schriftartfamilie an (serif, sans-serif oder monospace).

(**) Arbeiten Sie bei numerischen Angaben immer mit Einheiten. Gebräuchliche Einheiten sind: px (Pixel), mm, cm, %. Verwenden Sie bei Dezimalbrüchen den Punkt (kein Komma).

(***) Weitere Angaben sind möglich, werden aber kaum von den Schriftarten unterstützt.

(****) Geben Sie die Schrifteigenschaften nacheinander (getrennt durch Leerzeichen) an. Die Reihenfolge ist egal.

Abstände, Ränder, Ausrichtung (Auszüge)

Ränder beschreiben die Abstände des HTML-Elements zum benachbarten oder übergeordneten Element.

CSS-Angabe	Wert	Bedeutung
`margin-top, margin-bottom, margin-left, margin-right, margin`	numerische Werte	Abstand nach oben, unten, links, rechts, allgemein
`text-indent`	numerischer Wert (auch negativ)	Texteinrückung
`line-height`	numerischer Wert	Zeilenhöhe
`vertical-align`	`top`, `middle`, `bottom`	vertikale Ausrichtung
`text-align`	`left`, `right`, `center`	horizontale Ausrichtung

margin-right wird von Netscape 4.x nicht interpretiert.

Rahmen, Innenabstände (Auszüge)

Innenabstände beschreiben den Abstand des Elementinhaltes zum Rand des Elementes.

CSS-Angabe	Wert	Bedeutung
`padding-top, padding-bottom, padding-left, padding-right, padding`	numerische Werte	Innenabstand nach oben, unten, links, rechts, allgemein
`border-top-width, border-bottom-width, border-left-width, border-right-width, border-width`	numerischer Wert, `thin` (dünn), `medium` (mittel), `thick` (dick)	Rahmendicke oben, unten, links, rechts, allgemein
`border-color`	numerischer Wert	Rahmenfarbe
`border-style`	`none` (ohne), `dotted` (gepunktet), `dashed` (gestrichelt), `solid` (durchgezogen), `double` (doppelt), `groove` , `ridge`, `inset`, `outset` (3D-Effekte)	Rahmen-Stil

Internet Explorer interpretiert border-width nur, wenn der Rahmentyp border-style angegeben wird.

Netscape setzt Rahmen nur unmittelbar um das (Text-)Element, Internet-Explorer über die gesamte Fensterbreite.

Ein Service von http://www.hechtnetz.de

Start > Einleitung > CSS einbinden > CSS-Angaben 1 > CSS-Angaben 2 > Phase5