diff options
Diffstat (limited to 'files/de/web/css/pseudo-elements/index.html')
-rw-r--r-- | files/de/web/css/pseudo-elements/index.html | 78 |
1 files changed, 78 insertions, 0 deletions
diff --git a/files/de/web/css/pseudo-elements/index.html b/files/de/web/css/pseudo-elements/index.html new file mode 100644 index 0000000000..399548ad95 --- /dev/null +++ b/files/de/web/css/pseudo-elements/index.html @@ -0,0 +1,78 @@ +--- +title: Pseudoelemente +slug: Web/CSS/Pseudo-elements +translation_of: Web/CSS/Pseudo-elements +--- +<div>{{ CSSRef() }}</div> + +<h2 id="Summary">Summary</h2> + +<p>Wie auch {{ Cssxref("pseudo-classes") }} können Pseudoelemente einem Selektor hinzugefügt werden, aber statt einzelen Zustände ermöglichen Sie das gestalten eines einzelnen Teils von einem Element. Das Pseudoelement {{ Cssxref("::first-line") }} richtet sich bspw. nur an die erste Zeile eines Elements.</p> + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox">selector::pseudo-element { + property: value; +}</pre> + +<h2 id="Pseudoelemente">Pseudoelemente</h2> + +<ul> + <li>{{ Cssxref("::after") }}</li> + <li>{{ Cssxref("::before") }}</li> + <li>{{ Cssxref("::first-letter") }}</li> + <li>{{ Cssxref("::first-line") }}</li> + <li>{{ Cssxref("::selection") }}</li> +</ul> + +<h2 id="Hinweis">Hinweis</h2> + +<p>Pseudoelemente sind sowohl mit zwei Doppelpunkten (::), als auch mit nur einem (:) anzutreffen. In der CSS3 Spezifikation wurde darin der Unterschied zwischen Pseudoelement und Pseudoklasse festgelegt. Die meisten Browser unterstützten aber beide Varianten.</p> + +<div class="note"><strong>Hinweis:</strong> <code>::selection</code> muss zwingend mit zwei Doppelpunkten (::) geschrieben werden.</div> + +<p class="note">Es ist immer nur ein Pseudoelement pro Selektor möglich.</p> + +<table class="standard-table"> + <tbody> + <tr> + <th>Browser</th> + <th>Lowest Version</th> + <th>Support of</th> + </tr> + <tr> + <td rowspan="2">Internet Explorer</td> + <td>8.0</td> + <td><code>:pseudo-element</code></td> + </tr> + <tr> + <td>9.0</td> + <td><code>:pseudo-element ::pseudo-element</code></td> + </tr> + <tr> + <td rowspan="2">Firefox (Gecko)</td> + <td>1.0 (1.0)</td> + <td><code>:pseudo-element</code></td> + </tr> + <tr> + <td>1.0 (1.5)</td> + <td><code>:pseudo-element ::pseudo-element</code></td> + </tr> + <tr> + <td rowspan="2">Opera</td> + <td>4.0</td> + <td><code>:pseudo-element</code></td> + </tr> + <tr> + <td>7.0</td> + <td><code>:pseudo-element ::pseudo-element</code></td> + </tr> + <tr> + <td>Safari (WebKit)</td> + <td>1.0 (85)</td> + <td><code>:pseudo-element ::pseudo-element</code></td> + </tr> + </tbody> +</table> + +<p> </p> |