1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
|
---
title: transform
slug: Web/CSS/transform
tags:
- BrauchtBeispiele
- BrauchtBrowserKompatibilität
- CSS-Eigenschaft
- Referenz
translation_of: Web/CSS/transform
---
<p> {{CSRef}} {{SeheCompatTable}}</p>
<p>Mit der Eigenschaft "CSS übersetzen" können Sie Übersetzungstransformationen einzeln und unabhängig von der Eigenschaft<br>
{{CSSxRef ("transform")}} angeben. Dadurch wird die typische Verwendung der Benutzeroberfläche besser abgebildet, und Sie müssen sich nicht die genaue Reihenfolge der Transformationsfunktionen merken, die im Transformationswerte angegeben werden müssen.</p>
<p>Syntax</p>
<p>/ * Schlüsselwortwerte * / translate: none; / * Einzelwerte * / translate: 100px; übersetzen: 50%; / * Zwei Werte * / translate: 100px 200px; übersetzen: 50% 105px; / * Drei Werte * / übersetzen: 50% 105px 5rem;</p>
<p><br>
Values</p>
<p><p> {{HTMLSidebar ("Global_attributes")}} </p></p>
<p> <p> <span class = "seoSummary"> Das <strong> translate </strong> <a href="/en-US/docs/Web/HTML/Global_attributes"> globale Attribut </a> ist ein aufgezähltes Attribut, das wird verwendet, um anzugeben, ob die <em> übersetzbaren Attributwerte </em> eines Elements und die untergeordneten Knoten {{domxref ("Text")}} beim Lokalisieren der Seite übersetzt werden sollen oder ob sie unverändert bleiben sollen. </span> Es kann folgende Werte annehmen:<br>
</p></p>
<p><ul><br>
<li> leere Zeichenfolge oder <code> "yes" </code>, die angibt, dass das Element übersetzt werden soll, wenn die Seite lokalisiert wird. </i><br>
<li> <code> "no" </code> gibt an, dass das Element nicht übersetzt werden darf. </li><br>
</ul></p>
<p> <p> Obwohl nicht alle Browser dieses Attribut erkennen, wird es von automatischen Übersetzungssystemen wie Google Translate und möglicherweise auch von Tools, die von menschlichen Übersetzern verwendet werden, respektiert. Aus diesem Grund ist es wichtig, dass Webautoren dieses Attribut verwenden, um Inhalte zu markieren, die nicht übersetzt werden sollen. </P></p>
<p> <h2 id = "Specifications"> Spezifikationen </h2></p>
<p> <table class = "standard-table"><br>
<tbody><br>
<tr><br>
<th scope = "col"> Spezifikation </th><br>
<th scope = "col"> Status </th><br>
<th scope = "col"> Kommentar </th><br>
</tr><br>
<tr><br>
<td> {{SpecName ('HTML WHATWG', "dom.html # attr-translate", "translate")}} </td><br>
<td> {{Spec2 ('HTML WHATWG')}} </td><br>
<td> Keine Änderung gegenüber dem letzten Snapshot {{SpecName ('HTML5.1')}} </td><br>
</tr><br>
<tr><br>
<td> {{SpecName ('HTML5.1', "dom.html # the-translate-attribute", "translate")}} </td><br>
<td> {{Spec2 ('HTML5.1')}} </td><br>
<td> Momentaufnahme von {{SpecName ('HTML WHATWG')}}, ursprüngliche Definition </td><br>
</tr><br>
</tbody><br>
</table></p>
<p> <h2 id = "Browser_compatibility"> Browserkompatibilität </h2></p>
<p> <div class = "hidden"> Die Kompatibilitätstabelle auf dieser Seite wird aus strukturierten Daten generiert. Wenn Sie zu den Daten beitragen möchten, lesen Sie <a href="https://github.com/mdn/browser-compat-data"> https://github.com/mdn/browser-compat- Daten </a> und senden Sie uns eine Pull-Anfrage. </div></p>
<p> <p> {{Compat ("html.global_attributes.translate")}} </p></p>
<p> <h2 id = "See_also"> Siehe auch </h2></p>
<p> <ul><br>
<li> Alle <a href="/en-US/docs/Web/HTML/Global_attributes"> globalen Attribute </a>. </li><br>
<li> Die Eigenschaft {{domxref ("HTMLElement.translate")}}, die dieses Attribut widerspiegelt. </li><br>
<li> <a href="https://www.w3.org/International/questions/qa-translate-flag"> Verwenden des HTML-Übersetzungsattributs </a> </li><br>
</ul></p>
<p><br>
Formal syntax</p>
<p>{{CSSSyntax}}</p>
<p>Examples</p>
<p>HTML</p>
<p><div><br>
<p class="translate"> Translation<br>
</p> </div></p>
<p>CSS</p>
<p>* { box-sizing: border-box; } html { font-family: sans-serif; } div { width: 150px; margin: 0 auto; } p { padding: 10px 5px; border: 3px solid black; border-radius: 20px; width: 150px; font-size: 1.2rem; text-align: center; } .translate { transition: translate 1s; } div:hover .translate { translate: 200px 50px; }</p>
<p>Result</p>
<p>{{EmbedLiveSample<br>
('Examples')}}</p>
<p>Specifications</p>
<p>SpecificationStatusComment{{SpecName('CSS Transforms 2', '#individual-transforms', 'individual transforms')}}{{Spec2('CSS Transforms 2')}}Initial definition.</p>
<p>{{CSSInfo}}</p>
<p>Browser-Kompatibilität</p>
<p>Die Kompatibilitätstabelle auf dieser Seite wird aus strukturierten Daten generiert. Wenn Sie zu den Daten beitragen möchten, lesen Sie bitte https://github.com/mdn/browser-compat-data und senden Sie uns eine Pull-Anfrage.<br>
{{Compat("css.properties.translate")}}</p>
<p> Siehe auch</p>
<p>{{cssxref ('scale')}}</p>
<p>{{cssxref ('rotate')}}</p>
<p>{{cssxref ('transform')}}</p>
<p>hinweis: skew ist kein unabhängiger Transformationswert</p>
<p><br>
Übersetzung in Deutsch:</p>
<p>Benötigen Sie Hilfe? • Leitfaden für Redakteure • Stilleitfaden</p>
<p>Sie haben einen Entwurf vom: 21.10.2019 16:52:53.</p>
<p>Entwurf automatisch gespeichert: 21.10.2019 16:55:27</p>
<p> </p>
|