From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:15 -0500 Subject: initial commit --- files/de/web/css/font/index.html | 176 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 176 insertions(+) create mode 100644 files/de/web/css/font/index.html (limited to 'files/de/web/css/font') diff --git a/files/de/web/css/font/index.html b/files/de/web/css/font/index.html new file mode 100644 index 0000000000..6e0fecf56b --- /dev/null +++ b/files/de/web/css/font/index.html @@ -0,0 +1,176 @@ +--- +title: font +slug: Web/CSS/font +tags: + - CSS + - CSS Referenz +translation_of: Web/CSS/font +--- +

{{CSSRef}}

+ +

Die font Eigenschaft hat zwei unterschiedliche Verwendungszwecke:

+ +
    +
  1. Die font Eigenschaft kann als Kurzform für die Eigenschaften font-style, font-variant, font-weight, font-size, line-height und font-family dienen und setzt dabei, wie bei jeder Kurzform, die einzelnen Eigenschaften auf ihre Standardwerte zurück, wenn nichts weiter angegeben wird, oder
    2. +
  2. die jeweilige Schrift eines Elementes kann auf eine Systemschriftart festlegt werden. Diese Systemschriftarten können jedoch nur über die font Eigenschaft gesetzt werden und nicht etwa über die font-family Eigenschaft, sodass font nicht nur als eine Kurznotation von verschiedenen Schrift-Eigenschaften anzusehen ist.
    3. +
+ +

Außerdem ist zu beachten, dass font keine weiteren Eigenschaften wie etwa font-stretch oder font-size-adjust mit einschließt und font-size-adjust dennoch auf den Standardwert (normal) zurückgesetzt wird, wenn die font Eigenschaft notiert wird.
+ Das Festlegen von font-size sowie font-family ist verpflichtend, sonst wird die Anweisung komplett ignoriert.

+ + + +

Syntax

+ +
[
+  [ <font-style> || <font-variant> || <font-weight> ]?
+  <font-size>
+  [ / <line-height> ]?
+  <font-family>
+]
+| caption | icon | menu | message-box | small-caption | status-bar
+| -moz-window | -moz-desktop | -moz-workspace | -moz-document | -moz-info
+| -moz-dialog | -moz-button | -moz-pull-down-menu | -moz-list | -moz-field
+| inherit
+ +

Werte

+ +

Wird font als Kurzform verwendet, siehe einzelne Eigenschaften für die unterschiedlichen Werteangaben.

+ +

Werte für System-Fonts

+ +
+
caption
+
Schrift, die für Beschriftungen von Kontrollelementen (Buttons, Drop-Downs, etc.) verwendet wird.
+
icon
+
Schrift, die zur Beschriftung von Icons verwendet wird.
+
menu
+
Schrift die in Menüs benutzt wird.
+
message-box
+
Schrift die in Dialogboxen verwendet wird.
+
small-caption
+
Schrift die für kleine Kontrollelemente benutzt wird.
+
status-bar
+
Schrit die in Statusleisten benutzt wird.
+
+ +

Mozilla Erweiterungen für System-Fonts

+ +
+
-moz-window
+
Schrift, die für den Inhalt in einem Fenster verwendet wird.
+
-moz-desktop
+
Schrift, die auf dem Desktop benutzt wird.
+
-moz-workspace
+
Schrift, die für ein Arbeitsplatz-Fenster verwendet wird.
+
-moz-document
+
Schrift, die für den Inhalt eines Dokumentes benutzt wird.
+
-moz-dialog
+
Schrift die in Dialogboxen verwendet wird (wie message-box).
+
-moz-button
+
Schrift, die für Beschriftungen von Kontrollelementen (Buttons, Drop-Downs, etc.) verwendet wird (wie caption).
+
-moz-pull-down-menu
+
Schrift, die für Aufklapp-Menüs benutzt wird.
+
-moz-list
+
Schrift, die in Listenmenüs verwendet wird.
+
-moz-field
+
Schrift, die in Textfeldern (z.B. input) verwendet wird.
+
-moz-info
+
?
+
+ +

Beispiele

+ +

Link zum Live Beispiel

+ +

Beispiel 1

+ +
/* Setze die Schriftgröße auf 12px und die Zeilenhöhe auf 14px, sowie die Schriftart auf sans-serif */
+p { font: 12px/14px sans-serif }
+
+ +

Beispiel 2

+ +
/* Setze die Schriftgröße auf 80% des Elternelements und setze die Schriftart auf sans-serif */
+p { font: 80% sans-serif }
+
+/* Hat den gleichen Effekt wie: */
+p {
+  font-family: sans-serif;
+  font-style: normal;
+  font-variant: normal;
+  font-weight: 600;
+  font-size: 80%;
+  line-height: normal;
+}
+
+ +

Beispiel 3

+ +
/* Setze die Schriftstärke auf fett, die Textneigung auf kursiv, die Schriftgröße auf groß,
+und die Schriftart auf serif. */
+p { font: bold italic large serif }
+
+ +

Beispiel 4

+ +
/* Benutze die gleiche Schriftart wie die Statusleiste des Fensters. */
+p { font: status-bar }
+
+ +

Browser Kompatibilität

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Browserab Version
KurznotationSystemschriften
Internet Explorer3.0-4.04.0-5.5
Firefox (Gecko)1.0 (1.0)1.0 (1.0)
Opera3.56.0
Safari (WebKit)1.0 (85)1.0 (85)
+ +

Spezifikation

+ + + +

Siehe auch

+ + -- cgit v1.2.3-54-g00ecf