aboutsummaryrefslogtreecommitdiff
path: root/files/de/web/css/text-justify
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:15 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:15 -0500
commit4b1a9203c547c019fc5398082ae19a3f3d4c3efe (patch)
treed4a40e13ceeb9f85479605110a76e7a4d5f3b56b /files/de/web/css/text-justify
parent33058f2b292b3a581333bdfb21b8f671898c5060 (diff)
downloadtranslated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.tar.gz
translated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.tar.bz2
translated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.zip
initial commit
Diffstat (limited to 'files/de/web/css/text-justify')
-rw-r--r--files/de/web/css/text-justify/index.html117
1 files changed, 117 insertions, 0 deletions
diff --git a/files/de/web/css/text-justify/index.html b/files/de/web/css/text-justify/index.html
new file mode 100644
index 0000000000..441321a862
--- /dev/null
+++ b/files/de/web/css/text-justify/index.html
@@ -0,0 +1,117 @@
+---
+title: text-justify
+slug: Web/CSS/text-justify
+tags:
+ - CSS
+ - CSS Eigenschaft
+ - CSS Text
+ - Referenz
+translation_of: Web/CSS/text-justify
+---
+<div>{{CSSRef}}</div>
+
+<p>Die CSS Eigenschaft <strong><code>text-justify</code></strong> legt fest, wie der Blocksatz ausgeführt werden soll, wenn ein Element auf {{cssxref("text-align")}}<code>: justify;</code> gesetzt ist.</p>
+
+<pre class="brush: css no-line-numbers">text-justify: none;
+text-justify: auto;
+text-justify: inter-word;
+text-justify: inter-character;
+text-justify: distribute; /* Deprecated value */
+</pre>
+
+<div>{{cssinfo}}</div>
+
+<h2 id="Syntax">Syntax</h2>
+
+<p>Die Eigenschaft <code>text-justify</code>  wird mit einem der Schlüsselwörter aus der folgenden Liste definiert.</p>
+
+<h3 id="Values">Values</h3>
+
+<dl>
+ <dt><code>none</code></dt>
+ <dd>Der Blocksatz ist abgeschaltet. Dies hat den gleichen Effekt wie wenn {{cssxref("text-align")}} überhaupt nicht definiert ist. Diese Einstellung is nützlich, wenn man den Blocksatz dynamisch ein- und ausschalten möchte.</dd>
+ <dt><code>auto</code></dt>
+ <dd>Der Browser entscheidet, wie der Blocksatz ausgeführt wird, abhängig von Performance und Qualität, aber auch, was angemessen ist für die Sprache des Textes (z.B. Deutsch, asiatische Sprachen). Dies ist die Standardeinstellung, wenn  <code>text-justify</code> nicht definiert ist.</dd>
+ <dt><code>inter-word</code></dt>
+ <dd>Um den Blocksatz zu erreichen, wird Weißraum zwischen den <em>Wörtern </em>eingefügt (also eine Variante zu {{cssxref("word-spacing")}}). Diese Form ist gebräuchlich für Sprachen, die Wörter mit Leerzeichen trennen, wie Deutsch oder Koreanisch.</dd>
+ <dt><code>inter-character</code></dt>
+ <dd>Um den Blocksatz zu erreichen, wird Weißraum zwischen den <em>Zeichen </em>eingefügt (also eine Variante zu {{cssxref("letter-spacing")}}). Diese Form ist gebräuchlich für Sprachen wie Japanisch.</dd>
+ <dt><code>distribute</code> {{deprecated_inline}}</dt>
+ <dd>Zeigt das gleiche Verhalten wie <code>inter-character</code>; dieser Wert wird beibehalten, um Abwärtskompatibilität zu gewährleisten.</dd>
+</dl>
+
+<h3 id="Formal_syntax">Formal syntax</h3>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Beispiele">Beispiele</h2>
+
+<div class="hidden">
+<pre class="brush: html">&lt;p class="none"&gt;&lt;code&gt;text-justify: none&lt;/code&gt; —&lt;br&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc ornare maximus vehicula. Duis nisi velit, dictum id mauris vitae, lobortis pretium quam. Quisque sed nisi pulvinar, consequat justo id, feugiat leo. Cras eu elementum dui.&lt;/p&gt;
+&lt;p class="auto"&gt;&lt;code&gt;text-justify: auto&lt;/code&gt; —&lt;br&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc ornare maximus vehicula. Duis nisi velit, dictum id mauris vitae, lobortis pretium quam. Quisque sed nisi pulvinar, consequat justo id, feugiat leo. Cras eu elementum dui.&lt;/p&gt;
+&lt;p class="dist"&gt;&lt;code&gt;text-justify: distribute&lt;/code&gt; —&lt;br&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc ornare maximus vehicula. Duis nisi velit, dictum id mauris vitae, lobortis pretium quam. Quisque sed nisi pulvinar, consequat justo id, feugiat leo. Cras eu elementum dui.&lt;/p&gt;
+&lt;p class="word"&gt;&lt;code&gt;text-justify: inter-word&lt;/code&gt; —&lt;br&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc ornare maximus vehicula. Duis nisi velit, dictum id mauris vitae, lobortis pretium quam. Quisque sed nisi pulvinar, consequat justo id, feugiat leo. Cras eu elementum dui.&lt;/p&gt;
+&lt;p class="char"&gt;&lt;code&gt;text-justify: inter-character&lt;/code&gt; —&lt;br&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc ornare maximus vehicula. Duis nisi velit, dictum id mauris vitae, lobortis pretium quam. Quisque sed nisi pulvinar, consequat justo id, feugiat leo. Cras eu elementum dui.&lt;/p&gt;</pre>
+</div>
+
+<pre class="brush: css">p {
+ font-size: 1.5em;
+ border: 1px solid black;
+ padding: 10px;
+ width: 95%;
+ margin: 10px auto;
+ text-align: justify;
+}
+
+.none {
+ text-justify: none;
+}
+
+.auto {
+ text-justify: auto;
+}
+
+.dist {
+ text-justify: distribute;
+}
+
+.word {
+ text-justify: inter-word;
+}
+
+.char {
+ text-justify: inter-character;
+}</pre>
+
+<p>{{EmbedLiveSample("Examples","100%",400)}}</p>
+
+<h2 id="Spezifikationen">Spezifikationen</h2>
+
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Specification</th>
+ <th scope="col">Status</th>
+ <th scope="col">Comment</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>{{SpecName('CSS3 Text', '#text-justify-property', 'text-justify')}}</td>
+ <td>{{Spec2('CSS3 Text')}}</td>
+ <td></td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Browserkompatibilität">Browserkompatibilität</h2>
+
+
+
+<p>{{Compat("css.properties.text-justify")}}</p>
+
+<h2 id="Siehe_auch">Siehe auch</h2>
+
+<ul>
+ <li>{{cssxref("text-align")}}</li>
+</ul>