diff options
Diffstat (limited to 'files/de/web/css/word-spacing/index.html')
-rw-r--r-- | files/de/web/css/word-spacing/index.html | 107 |
1 files changed, 107 insertions, 0 deletions
diff --git a/files/de/web/css/word-spacing/index.html b/files/de/web/css/word-spacing/index.html new file mode 100644 index 0000000000..f9f6fb1e83 --- /dev/null +++ b/files/de/web/css/word-spacing/index.html @@ -0,0 +1,107 @@ +--- +title: word-spacing +slug: Web/CSS/word-spacing +tags: + - CSS + - CSS Text + - NeedsLiveSample + - NeedsMobileBrowserCompatibility + - Property + - Referenz +translation_of: Web/CSS/word-spacing +--- +<div>{{CSSRef}}</div> + +<h2 id="Übersicht">Übersicht</h2> + +<p>Die<strong> <code>word-spacing</code></strong> <a href="/de/docs/Web/CSS">CSS</a> Eigenschaft gibt das Abstandsverhalten zwischen Tags und Wörtern an.</p> + +<p>{{cssinfo}}</p> + +<h2 id="Syntax">Syntax</h2> + +<pre class="brush:css">/* Schlüsselwortwerte */ +word-spacing: normal; + +/* <length> Werte */ +word-spacing: 3px; +word-spacing: 0.3em; + +/* <percentage> Werte */ +word-spacing: 50%; +word-spacing: 200%; + +/* Globale Werte */ +word-spacing: inherit; +word-spacing: initial; +word-spacing: unset; +</pre> + +<h3 id="Werte">Werte</h3> + +<dl> + <dt><code>normal</code></dt> + <dd>Der normale Abstand zwischen Wörtern, wie durch die aktuelle Schriftart und/oder den Browser angegeben.</dd> + <dt><code><length></code></dt> + <dd>Definiert Abstände zusätzlich zu den immanenten Abständen zwischen den Wörtern, die durch die Schriftart definiert werden. Siehe {{cssxref("<length>")}} für mögliche Einheiten.</dd> + <dt><code><percentage></code></dt> + <dd>Definiert die zusätzlichen Abstände als Prozentwert der Breite des betreffenden Zeichens.</dd> +</dl> + +<h3 id="Formale_Syntax">Formale Syntax</h3> + +<pre class="syntaxbox">{{csssyntax}}</pre> + +<h2 id="Beispiele">Beispiele</h2> + +<p>Der folgende CSS Code:</p> + +<pre class="brush: css">#mozdiv1 { + word-spacing: 15px; +} + +#mozdiv2 { + word-spacing: 5em; +}</pre> + +<p>formatiert zwei {{HTMLElement("div")}} Tags, die Text beinhalten wie hier gezeigt:</p> + +<p><img alt="example.png" class="default internal" src="/@api/deki/files/6103/=example.png"></p> + +<h2 id="Spezifikationen">Spezifikationen</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spezifikation</th> + <th scope="col">Status</th> + <th scope="col">Kommentar</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('CSS3 Text', '#propdef-word-spacing', 'word-spacing')}}</td> + <td>{{Spec2('CSS3 Text')}}</td> + <td>Ersetzt die vorherigen Werte mit einem <code><spacing-limit></code> Wert, der denselben Wert definiert plus den <code><percentage></code> Wert und erlaubt bis zu drei Werte, die den Optimal-, Minimal- und Maximalwert beschreiben.</td> + </tr> + <tr> + <td>{{SpecName('CSS3 Transitions', '#animatable-css', 'word-spacing')}}</td> + <td>{{Spec2('CSS3 Transitions')}}</td> + <td>Definiert <code>word-spacing</code> als animierbar.</td> + </tr> + <tr> + <td>{{SpecName('CSS2.1', 'text.html#propdef-word-spacing', 'word-spacing')}}</td> + <td>{{Spec2('CSS2.1')}}</td> + <td>Keine Änderung</td> + </tr> + <tr> + <td>{{SpecName('CSS1', '#word-spacing', 'word-spacing')}}</td> + <td>{{Spec2('CSS1')}}</td> + <td>Ursprüngliche Definition</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_Kompatibilität">Browser Kompatibilität</h2> + +{{Compat("css.properties.word-spacing")}} |