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/text-transform/index.html | 504 +++++++++++++++++++++++++++++ 1 file changed, 504 insertions(+) create mode 100644 files/de/web/css/text-transform/index.html (limited to 'files/de/web/css/text-transform/index.html') diff --git a/files/de/web/css/text-transform/index.html b/files/de/web/css/text-transform/index.html new file mode 100644 index 0000000000..5461a868a2 --- /dev/null +++ b/files/de/web/css/text-transform/index.html @@ -0,0 +1,504 @@ +--- +title: text-transform +slug: Web/CSS/text-transform +translation_of: Web/CSS/text-transform +--- +
{{CSSRef}}
+ +

Übersicht

+ +

Das text-transform CSS Attribut legt die Groß- und Kleinschreibung eines Elementes fest. Es kann verwendet werden, um den Text eines Elementes komplett klein oder klein zu schreiben oder den ersten Buchstaben jedes Wortes groß zu schreiben.

+ +
+

Das text-transform Attribut berücksichtigt sprachspezifische Regeln:

+ + + +

Die Sprache wird durch das lang HTML Attribut oder das xml:lang XML Attribut festgelegt..

+ +

Die Unterstützung dieser spezifischen Fälle unterscheidet sich von Browser zu Browser, also prüfen Sie dies anhand der Kompatibilitätstabelle.

+
+ +

{{cssinfo}}

+ +

Syntax

+ +
Formal syntax: {{csssyntax("text-transform")}}
+
+ +
text-transform: capitalize
+text-transform: uppercase
+text-transform: lowercase
+text-transform: none
+text-transform: full-width
+
+text-transform: inherit
+
+ +

Werte

+ +
+
capitalize
+
Ein Schlüsselwort, dass die Großschreibung des Anfachsbuchstaben jedes Wortes erzwingt. Geändert werden alle Unicode-basierten Zeichen außer Symbole. Dabei bleiben alle anderen Zeichen unverändert.
+
+
Bei der automatischen Großschreibung sollte je nach Sprache die Kompatibilität beachtet und überprüft werden. 
+
+
uppercase
+
Wendet die Großschreibung auf alle Zeichen an.
+
lowercase
+
Erzwingt die Kleinschreibung aller Zeichen.
+
none
+
Verhindert Änderungen; alle Buchstaben bleiben unverändert.
+
full-width {{experimental_inline}}
+
Erzwingt das Rendern der Buchstaben als rechteckige Form, was z.B. die Interaktion mit ostasiatischen Sprachen (z.B. Chinesisch oder Japanisch) erlaubt.
+
+ +

Beispiele

+ + + + + + + + + + + + + + + + + + + +
p { text-transform: none; }
ZeichenketteLorem ipsum dolor sit amet, consectetur adipisicing elit, ...
EchtzeitbeispielLorem ipsum dolor sit amet, consectetur adipisicing elit, ...
ReferenzwertLorem ipsum dolor sit amet, consectetur adipisicing elit, ...
+ + + + + + + + + + + + + + + + + + + +
p { text-transform: capitalize; }
ZeichenketteLorem ipsum dolor sit amet, consectetur adipisicing elit, ...
EchtzeitbeispielLorem ipsum dolor sit amet, consectetur adipisicing elit, ...
ReferenzwertLorem Ipsum Dolor Sit Amet, Consectetur Adipisicing Elit, ...
+ + + + + + + + + + + + + + + + + + + +
+

p { text-transform: capitalize; }

+ +

Die Großschreibung beginnt bei Zeichen, die nach Unicode der Buchstabenkategorie angehören.

+
Zeichenkette(this) “is” [a] –short– -test- «for» *the* _css_ ¿capitalize? ?¡transform!
Echtzeitbeispiel(this) “is” [a] –short– -test- «for» *the* _css_ ¿capitalize? ?¡transform!
Referenzwert(This) “Is” [A] –Short– -Test- «For» *The* _Css_ ¿Capitalize? ?¡Transform!
+ + + + + + + + + + + + + + + + + + + +
+

p { text-transform: capitalize; }

+ +

Symbole werden ignoriert. Auch hier wird erst der erste gefundene Buchstabe in einer Zeichenkette großgeschrieben.

+
Zeichenketteⓐⓑⓒ (ⓓⓔⓕ) —ⓖⓗⓘ— ⓙkl
Echtzeitbeispielⓐⓑⓒ (ⓓⓔⓕ) —ⓖⓗⓘ— ⓙkl
Referenzwertⓐⓑⓒ (ⓓⓔⓕ) —ⓖⓗⓘ— ⓙKl
+ + + + + + + + + + + + + + + + + + + +
p { text-transform: capitalize; }
+ Das dänische Digraph ij muss wie ein einzelnes Zeichen behandelt werden.
ZeichenketteThe Dutch word: "ijsland" starts with a digraph.
EchtzeitbeispielThe Dutch word: "ijsland" starts with a digraph.
ReferenzwertThe Dutch Word: "IJsland" Starts With A Digraph.
+ + + + + + + + + + + + + + + + + + + +
p { text-transform: uppercase; }
ZeichenketteLorem ipsum dolor sit amet, consectetur adipisicing elit, ...
EchtzeitbeispielLorem ipsum dolor sit amet, consectetur adipisicing elit, ...
ReferenzwertLOREM IPSUM DOLOR SIT AMET, CONSECTETUR ADIPISICING ELIT, ...
+ + + + + + + + + + + + + + + + + + + +
+

p { text-transform: uppercase; }

+ +

Bei Griechischen Vokalen sollte, außer bei einem trennenden eta, auf Akzente verzichtet werden. Bei der Großschreibung eines ersten Vokals mit Akzent kommt es bei zwei direkt aufeinander folgenden Vokalen zu einer Diaräse.

+
ZeichenketteΘα πάμε στο "Θεϊκό φαΐ" ή στη "Νεράιδα";
EchtzeitbeispielΘα πάμε στο "Θεϊκό φαΐ" ή στη "Νεράιδα";
ReferenzwertΘΑ ΠΑΜΕ ΣΤΟ "ΘΕΪΚΟ ΦΑΪ" Ή ΣΤΗ "ΝΕΡΑΪΔΑ";
+ + + + + + + + + + + + + + + + + + + +
p { text-transform: lowercase; }
ZeichenketteLorem ipsum dolor sit amet, consectetur adipisicing elit, ...
EchtzeitbeispielLorem ipsum dolor sit amet, consectetur adipisicing elit, ...
Referenzwertlorem ipsum dolor sit amet, consectetur adipisicing elit, ...
+ + + + + + + + + + + + + + + + + + + +
+

p { text-transform: lowercase; }

+ +

Der griechische Buchstabe Sigma (Σ) wird je nach Kontext in ein kleingeschriebenes Sigma (σ) oder die entsprechene Wortvariante (ς) umgewandelt.

+
ZeichenketteΣ IS A greek LETTER that appears SEVERAL TIMES IN ΟΔΥΣΣΕΥΣ.
EchtzeitbeispielΣ IS A greek LETTER that appears SEVERAL TIMES IN ΟΔΥΣΣΕΥΣ.
Referenzwertσ is a greek letter that appears several times in ΟΔΥΣΣΕΥς.
+ + + + + + + + + + + + + + + + + + + +
p { text-transform: full-width; }
+ Some characters exists in two formats, normal width and a full-width, with different Unicode code points. The full-width version is used to mix them smoothly with Asian ideographic characters.
Zeichenkette0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ!"#$%&()*+,-./:;<=>?@{|}~
Echtzeitbeispiel0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ!"#$%&()*+,-./:;<=>?@{|}~
Referenzwert０１２３４５６７８９ａｂｃｄｅｆｇｈｉｊｋｌｍｎｏｐｑｒｓｔｕｖｗｘｙｚＡＢＣＤＥＦＧＨＩＪＫＬＭＮＯＰＱＲＳＴＵＶＷＸＹＺ！＂＃＄％＆（）＊＋，－．／：；＜＝＞？＠｛｜｝～
+ +

Details

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentrar
{{SpecName('CSS4 Text', '#text-transform', 'text-transform')}}{{Spec2('CSS4 Text')}}Aus{{SpecName('CSS3 Text', '#text-transform', 'text-transform')}} :Fügt das Schlüsselwort full-size-kana hinzu und erlaubt die Kombination von Schlüsselwörtern mit full-width
{{SpecName('CSS3 Text', '#text-transform', 'text-transform')}}{{Spec2('CSS3 Text')}} +

Aus {{SpecName('CSS2.1', 'text.html#caps-prop', 'text-transform')}} : Mehr Zahlen und Buchstaben können verwendet werden. Das Schlüsselwort capitalize aktiviert die Großschreibung nur beim ersten unterstützten Zeichen eines Wortes; andere Zeichen werden ignoriert. Erhöhung der Kompatibilität des Schlüsselwortes full-width.

+
{{SpecName('CSS2.1', 'text.html#caps-prop', 'text-transform')}}{{Spec2('CSS2.1')}}Aus {{SpecName('CSS1', '#text-transform', 'text-transform')}} : Ergänzung des Umfangs an unterstützten Zeichen um einige nicht-lateinische Buchstaben
{{SpecName('CSS1', '#text-transform', 'text-transform')}}{{Spec2('CSS1')}}
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Grundfunktionalität1.0{{CompatGeckoDesktop("1")}}4.07.01.0
capitalize (CSS3 version)siehe Bemerkung{{CompatGeckoDesktop("14")}} (siehe Bemerkung)siehe Bemerkung{{CompatUnknown}}siehe Bemerkung
full-size-kana{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
full-width{{CompatNo}}{{CompatGeckoDesktop("19")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
ß → SS{{CompatUnknown}}{{CompatGeckoDesktop("1")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
i → İ and ı → I{{CompatNo}}{{CompatGeckoDesktop("14")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatNo}}
Dänisches IJ Digraph{{CompatNo}}{{CompatGeckoDesktop("14")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Griech. Zeichen mit Akzent{{CompatNo}}{{CompatGeckoDesktop("15")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Σ → σ bzw. ς30{{CompatGeckoDesktop("14")}}{{CompatNo}}{{CompatNo}}6.0
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Grundfunktionalität1.0{{CompatGeckoMobile("1")}}6.06.01.0
capitalize (CSS3 version)siehe Bemerkung{{CompatGeckoMobile("14")}} siehe Bemerkungsiehe Bemerkung{{CompatUnknown}}siehe Bemerkung
full-size-kana{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
full-width{{CompatNo}}{{CompatGeckoMobile("19")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
ß → SS{{CompatUnknown}}{{CompatGeckoMobile("1")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
i → İ and ı → I{{CompatNo}}{{CompatGeckoMobile("14")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatNo}}
Dänisches IJ Digraph{{CompatNo}}{{CompatGeckoMobile("14")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Griech. Zeichen mit Akzent{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Σ → σ bzw. ς{{CompatNo}}{{CompatGeckoMobile("14")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +

Browserinformationen

+ +

Das capitalize Schlüsselwort wurde in CSS1 bzw. CSS 2.1 nicht eindeutig spezifiziert. Dadurch wurde der erste großzuschreibende Buchstabe unterschiedlich ermittelt. Sowohl Webkit-basierte Browser als auch die Gecko Engine identifizierte Symbole fälschlicherwiese als Buchstaben. Beispielsweise galten bei Firefox - respektive _ als Buchstaben. Internet Explorer 9 hielt sich den Spezifikationen insgesamt am nächsten. Mit CSS3 wurde das Verhalten vereinheitlicht. Der Kompatibilitätstabelle können die Browserversionen entnommen werden, mit denen der Standard erstmals exakt umgesetzt wurde.

+ +

Siehe auch

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