2.4.5 Schriftgrösse
en Font-size
fr Taille de police des caractères

• 1 Prinzip
• 2 Angabe der Schriftgrösse in Punkten style="font-size:6pt"
• 3 Angabe der Schriftgrösse in em: style="font-size:0.75em"
• 4 Schriftgrösse in Schlüsselworten
  • a) Absolute Schlüsselworte style="font-size:xx-small"
  • b) Relative Schlüsselworte style="font-size:smaller"
• 5 Websites

-

⇧ 1 Prinzip

Mit font-size wird die Schriftgrösse bestimmt.
Erlaubt sind numerische Angaben , Prozentangaben und absolute und relative Schlüsselworte.
Prozentwerte beziehen sich auf die Schriftgrösse des Elternelements.

• SELFHTML-Wiki
  de font-size (Schriftgrösse) de Beispiel ansehen
  de Absolute Längenmaße de Relative Längenmaße
  

-

⇧ 2 Angabe der Schriftgrösse in Punkten style="font-size:6pt"

1) Angabe im Quelltext

<p>
 <span style="font-size:6pt">Beispieltext
 mit Schriftgrösse 6pt</span><br>
 <span style="font-size:8pt">Beispieltext
 mit Schriftgrösse 8pt</span><br>
 <span style="font-size:10pt">Beispieltext
 mit Schriftgrösse 10pt</span><br>
 <span style="font-size:12pt">Beispieltext
 mit Schriftgrösse 12pt</span><br>
 <span style="font-size:14pt">Beispieltext
 mit Schriftgrösse 14pt</span><br>
 <span style="font-size:18pt">Beispieltext
 mit Schriftgrösse 18pt</span><br>
</p>

2) Ausgabe im HTML-Dokument

Beispieltext mit Schriftgrösse 6pt
Beispieltext mit Schriftgrösse 8pt
Beispieltext mit Schriftgrösse 10pt
Beispieltext mit Schriftgrösse 12pt
Beispieltext mit Schriftgrösse 14pt
Beispieltext mit Schriftgrösse 18pt

-

⇧ 3 Angabe der Schriftgrösse in em: style="font-size:0.75em"

1) Beispiel der Formatierung einer Tabellenzeile im Quelltext:

<td style="font-size:10px">font-size:10px</td>
<td style="font-size:0.63em">font-size:0.63em</td>

2) Tabelle:

Basisschriftgrösse: 100.1% bei Browsereinstellung von 16px
font-size:10px	font-size:0.63em
font-size:11px	font-size:0.69em
font-size:12px	font-size:0.75em
font-size:13px	font-size:0.82em
font-size:14px	font-size:0.88em
font-size:15px	font-size:0.93em
font-size:16px	font-size:1em
font-size:17px	font-size:1.06em
font-size:18px	font-size:1.12em
font-size:19px	font-size:1.19em
font-size:20px	font-size:1.25em
font-size:21px	font-size:1.32em
font-size:22px	font-size:1.38em
font-size:23px	font-size:1.44em
font-size:24px	font-size:1.5em
font-size:25px	font-size:1.56em
font-size:26px	font-size:1.63em
font-size:27px	font-size:1.69em
font-size:28px	font-size:1.75em
font-size:29px	font-size:1.82em
font-size:30px	font-size:1.88em
font-size:31px	font-size:1.94em
font-size:32px	font-size:2.01em

• Turski de Portal
  Turski de Tips und Tricks zu (X)HTML, CSS und JavaScript
  Turski de Seiteninterne Faktoren der Suchmaschinenoptimierung
  Turski de Code-Generator für ein barrierefreies CSS-Layout
  Turski de Infobox im Textbereich über CSS einblenden
  Turski de »em« nicht nur für Schriftgrößen!
  Turski de Das Stylesheet der Website von Turski

• Einfach für Alle de Lehrgang Barrierefreies Webdesign

-

⇧ 4 Schriftgrösse in Schlüsselworten

• a) Absolute Schlüsselworte style="font-size:xx-small"
• b) Relative Schlüsselworte style="font-size:smaller"

-

↑ a) Absolute Schlüsselworte style="font-size:xx-small"

<span style="font-size:xx-small">xx-small = winzig</span>

xx-small = winzig

---

<span style="font-size:x-small">x-small = sehr klein</span>

x-small = sehr klein

---

<span style="font-size:small">small = klein = kleiner als normal</span>

small = klein = kleiner als normal

---

<p>Normale Grösse</p>

Normale Grösse

---

<span style="font-size:medium">medium = mittel</span>

medium = mittel

---

<span style="font-size:big">big = big = grösser als normal</span>

big = big = grösser als normal

---

<span style="font-size:large">large = gross</span>

large = gross

---

<span style="font-size:x-large">x-large = sehr gross</span>

x-large = sehr gross

---

<span style="font-size:xx-large">xx-large = riesig</span>

xx-large = riesig

-

↑ b) Relative Schlüsselworte style="font-size:smaller"

<span style="font-size:smaller">smaller = kleiner als im Elternelement</span>

smaller = kleiner als im Elternelement

---

<p>Normale Grösse</p>

Normale Grösse

---

<span style="font-size:smaller">larger = grösser als im Elternelement</span>

larger = grösser als im Elternelement

-

⇧ 5 Websites

• SELFHTML-Wiki: CSS/Eigenschaften
  de Schriftformatierung
  

  de font (Zusammenfassung der möglichen Einzelangaben)
  de Beispiel ansehen

  de font-family (Schriftarten)
  de Beispiel ansehen

  de font-style (Schriftstil) de Beispiel ansehen
  

  de font-variant (Schriftvariante) de Beispiel ansehen
  

  de font-size (Schriftgrösse) de Beispiel ansehen
  de Absolute Längenmaße de Relative Längenmaße
  

  de line-height (Zeilenhöhe) de Beispiel ansehen
  

  de font-weight (Strichstärke) de Beispiel ansehen
  

  de font-size-adjust de Beispiel ansehen

  de font-stretch (Schriftlaufweite)
  de Alternative: letter-spacing
  de Beispiel letter-spacing ansehen

  de @font-face

• HTML-Seminar de HTML-Tags für Schriftgrösse
  HTML-Seminar de Punkt/Inch/Millimeter-Umrechner

• W3C Recommendation en Fonts
  W3C Recommendation de Schriften
  

• CSS 4 You de Schrift (font) de Beispiel
  CSS 4 You de Schriftart (font-family) de Beispiel
  CSS 4 You de Schriftgrösse (font-size) de Beispiel

• Web Design Group en Font Properties
  Web Design Group en Font
  Web Design Group en Syntax: font-family
  Web Design Group en Syntax: font-size
  Web Design Group en Syntax: font-weight
  Web Design Group en Syntax: font-variant
  Web Design Group en Syntax: font-style

• W3Schools en Beispiel: All the font properties in one declaration
  W3Schools en Beispiel: Set the font of a text
  W3Schools en Beispiel: Set the size of the font
  W3Schools en Beispiel: Set the boldness of the font
  W3Schools en Beispiel: Control the letters in a text
  W3Schools en Beispiel: Set the variant of the font
  W3Schools en Beispiel: Set the style of the font

↑