Version 264973 von cursor

  • Adressname der Version: CSS/cursor
  • Titel der Version: CSS/cursor
  • ID der Version: 264973
  • Erstellt:
  • Autor: Jürgen Jeka
  • Aktuelle Version? Nein
  • Kommentar Browsertabelle (Kompatibilität) aktualisiert; 22 words added, 22 words removed

Inhalt der Version

{{ CSSRef() }}

Übersicht

Die cursor Eigenschaft legt den Cursor fest, der angezeigt wird, wenn sich der Mauszeiger über einem Element befindet.

  • Standardwert: auto
  • Anwendbar auf: Alle Elemente
  • Vererbung: Ja
  • Medium: visuell, interaktiv
  • berechneter Wert: wie angegeben

Syntax

cursor:
[ [ uri [<x> <y>]?,]* 
  [ auto | default | none | context-menu | help | pointer | progress | wait | cell | 
    crosshair | text | vertical-text | alias | copy | move | no-drop | not-allowed | 
    e-resize | n-resize | ne-resize | nw-resize | s-resize | se-resize |
    sw-resize | w-resize | ew-resize | ns-resize | nesw-resize | nwse-resize |
    col-resize | row-resize | all-scroll ]
] | inherit

Werte

<uri>
Eine durch Kommata getrennte Liste, die auf benutzerdefinierte Bilder verweist, die als Cursor angezeigt werden sollen. Mehr als eine Angabe macht Sinn, um eine Ausweichlösung (Fallback) bei nicht unterstützten Bildformaten in anderen Browsern bereitzustellen. Am Ende der Liste muss ein Fallback stehen, welches einen Cursor ohne URL angibt, um einen Mauszeiger anzeigen zu können, wenn kein benutzerdefiniertes Bild geladen werden kann. Siehe auch: Verwendung von URL Werten für die cursor Eigenschaft für weitere Details.
<x> <y>
Optionale Angabe von X- und Y-Koordinaten (vom Internet Explorer nicht unterstützt). Angegeben werden zwei Zahlen ohne Einheit.
inherit
Der Wert des Elternelements wird geerbt.

Unterstützte CSS Standardwerte

Kategorie CSS Wert
Mouseover zum Testen
  Beschreibung
Allgemein auto   Der Browser bestimmt aufgrund des aktuellen Kontextes, welcher Cursor angezeigt wird.
Wenn der Mauszeiger sich zum Beispiel über dem Text befindet, wird der text Cursor angezeigt.
default default.gif Standard Cursor. Üblicherweise durch ein Pfeil dargestellt.
none   Es wird kein Cursor wird angezeigt.
Links & Status context-menu context-menu.png Ein Kontextmenü wird unter dem Cursor angezeigt.
Unter Windows nicht verfügbar. {{ Bug("258960") }}
help help.gif Zeigt an, dass Hilfe verfügbar ist.
pointer pointer.gif Wird zum Beispiel angezeigt, wenn der Mauszeiger sich über Links befindet. Üblicherweise durch eine Hand dargestellt.
progress progress.gif Zeigt an, dass das Programm im Hintergrund arbeitet und der Benutzer kann, anders als bei wait, weiterhin mit der Oberfläche arbeiten.
wait wait.gif Zeigt an, dass das Programm arbeitet. Manchmal auch durch eine Sanduhr oder eine Uhr dargestellt.
Auswahl cell cell.gif Zeigt an, dass Zellen ausgewählt werden können.
crosshair crosshair.gif Ein Kreuz, das oft zur Auswahl eines Bereiches in Bildern verwendet wird.
text text.gif Zeigt an, dass der Text ausgewählt werden kann.
vertical-text vertical-text.gif Zeigt an, dass vertikaler Text ausgewählt werden kann.
Drag and drop alias alias.gif Zeigt an, dass ein Tastenkürzel vorhanden ist.
copy copy.gif Zeigt an, dass etwas kopiert werden kann.
move move.gif Zeigt an, dass das Objekt bewegt werden kann.
no-drop no-drop.gifZeigt an, dass an der aktuellen Stelle nichts hinein gezogen werden darf.
{{ bug("275173") }} unter Windows ist no-drop gleich wie not-allowed.
not-allowed not-allowed.gif Zeigt an, dass hier etwas nicht erlaubt ist.
Skalierung & Scrollen all-scroll all-scroll.gif Zeigt an, dass etwas in alle Richtungen gescrollt werden kann.
{{ bug("275174") }} unter Windows ist all-scroll gleich wie move.
col-resize col-resize.gif Zeigt an, dass das Element bzw. die Spalte horizontal skaliert werden kann. Meistens als Pfeile dargestellt, die nach rechts und links zeigen und in der Mitte einen Trennbalken haben.
row-resize row-resize.gif Zeigt an, dass das Element bzw. die Zeile vertikal skaliert werden kann. Meistens als Pfeile dargestellt, die nach unten und oben zeigen und in der Mitte einen Trennbalken haben.
n-resize 6-resize.gif Zeigt an, dass von einer Ecke aus skaliert werden kann. Der se-resize Cursor wird zum Beispiel benutzt, wenn, von der unteren rechten Ecke aus, etwas bewegt/skaliert werden soll.
e-resize 3-resize.gif
s-resize 6-resize.gif
w-resize 3-resize.gif
ne-resize 1-resize.gif
nw-resize 4-resize.gif
se-resize 4-resize.gif
sw-resize 1-resize.gif
ew-resize 3-resize.gif Zeigt an, dass in zwei Richtungen (bidirektional) skaliert werden kann.
ns-resize 6-resize.gif
nesw-resize 1-resize.gif
nwse-resize 4-resize.gif

Mozilla Erweiterungen

-moz-grab grab.gif Zeigt an, dass das Element angefasst werden kann.

Diese Cursor sind für öffentliche Webseiten nicht zu empfehlen.

Die Benutzung von benutzerdefinerten Bildern für den Cursor bietet sich für eine browserübergreifende Lösung eher an.

Im Safari (Webkit) existieren gleichnamige Eigenschaften mit dem Präfix -webkit-.

-moz-grabbing grabbing.gif Zeigt an, dass das Element gerade angefasst wird.
-moz-zoom-in zoom-in.gif Zeigt an, dass ein Element vergrößert werden kann. {{ bug("204841") }}
-moz-zoom-out zoom-out.gif Zeigt an, dass ein Element verkleinert werden kann. {{ bug("204841") }}

Hinweise

{{ gecko_callout_heading("2.0") }}

Unterstützung zum Laden eines Cursors von einer URI wurde für Mac OS X in Gecko 2.0 eingeführt. Vorherige Versionen unterstützen keine URI-Angaben unter OS X.

Beispiele

Live Beispiel

.foo { cursor: crosshair; }

.bar { cursor: move;  cursor: cell; }  /* Benutze move wenn cell nicht unterstützt wird. */ 

.baz { url(hyper.cur), auto }          /* Standardwert als Fallback, damit ein Cursor gezeigt werden kann.*/

Browser Kompatibilität

Feature Chrome (WebKit) Firefox (Gecko) Internet Explorer Opera Safari
auto | crosshair | default | move | text | wait | help | n-resize | e-resize | s-resize | w-resize | ne-resize | nw-resize | se-resize | sw-resize 1.0 1.0 (1.0) 4.0 7.0 1.2
hand {{ non-standard_inline() }}(für diesen Zweck verwendet man pointer ) {{ CompatNo() }} {{ CompatNo() }} 4.0 {{ CompatNo() }} {{ CompatNo() }}
pointer | progress 1.0 1.0 (1.0|1.7) 6.0 7.x 1.2 | 3.0
url()   See Using URL values [en] 1.0 (523) 1.5 (1.8) 6.0 {{ CompatNo() }} 3.0
not-allowed | no-drop | vertical-text | all-scroll | col-resize | row-resize 1.0 (522) 1.5 (1.8) 6.0 10.6 3.0
alias | cell | copy | ew-resize | ns-resize | nesw-resize | nwse-resize | [1] context-menu 1.0 (522) 1.5 (1.8) {{ CompatNo() }} 10.6 3.0 [2]
none 5.0 (533) 3.0 (1.9) 9.0 {{ CompatNo() }} 5.0 [2]
inherit 1.0 1.0 8.0 9.0 1.2
zoom-in | zoom-out 1.0 (522) {{ property_prefix("-webkit-") }} 1.0 (1.4) {{ property_prefix("-moz-") }} {{ CompatNo() }} 11.6 3.0 {{ property_prefix("-webkit-") }}

[1] Mozilla and WebKit verwenden context-menu nicht in Windows, Opera schon.
[2] In Safari funktioniert alias, cell, copy, none nicht in Windows (was ist mit Mac?).

Spezifikation

Siehe auch

{{ languages( { "en": "en/CSS/cursor", "fr": "fr/CSS/cursor", "pl": "pl/CSS/cursor", "es": "es/CSS/cursor" } ) }}

Quelltext der Version

<p>{{ CSSRef() }}</p>
<h3 id=".C3.9Cbersicht">Übersicht</h3>
<p>Die <code>cursor</code> Eigenschaft legt den Cursor fest, der angezeigt wird, wenn sich der Mauszeiger über einem Element befindet.</p>
<ul> <li>Standardwert: auto</li> <li>Anwendbar auf: Alle Elemente</li> <li>Vererbung: Ja</li> <li>Medium: visuell, interaktiv</li> <li>berechneter Wert: wie angegeben</li>
</ul>
<h3 id="Syntax">Syntax</h3>
<pre class="eval" style="white-space:pre-wrap">cursor:
[ [ uri [&lt;x&gt; &lt;y&gt;]?,]* 
  [ auto | default | none | context-menu | help | pointer | progress | wait | cell | 
    crosshair | text | vertical-text | alias | copy | move | no-drop | not-allowed | 
    e-resize | n-resize | ne-resize | nw-resize | s-resize | se-resize |
    sw-resize | w-resize | ew-resize | ns-resize | nesw-resize | nwse-resize |
    col-resize | row-resize | all-scroll ]
] | inherit
</pre>
<h3 id="Werte">Werte</h3>
<dl> <dt>&lt;uri&gt;</dt> <dd>Eine durch Kommata getrennte Liste, die auf benutzerdefinierte Bilder verweist, die als Cursor angezeigt werden sollen. Mehr als eine Angabe macht Sinn, um eine Ausweichlösung (Fallback) bei nicht unterstützten Bildformaten in anderen Browsern bereitzustellen. Am Ende der Liste <strong>muss</strong> ein Fallback stehen, welches einen Cursor ohne URL angibt, um einen Mauszeiger anzeigen zu können, wenn kein benutzerdefiniertes Bild geladen werden kann. Siehe auch: <a href="/de/Verwendung_von_URL_Werten_für_die_cursor_Eigenschaft" title="de/Verwendung_von_URL_Werten_für_die_cursor_Eigenschaft">Verwendung von URL Werten für die cursor Eigenschaft</a> für weitere Details.</dd> <dt>&lt;x&gt; &lt;y&gt;</dt> <dd>Optionale Angabe von X- und Y-Koordinaten (vom Internet Explorer nicht unterstützt). Angegeben werden zwei Zahlen ohne Einheit.</dd> <dt>inherit</dt> <dd>Der Wert des Elternelements wird geerbt.</dd>
</dl>
<h4 id="Unterst.C3.BCtzte_CSS_Standardwerte">Unterstützte CSS Standardwerte</h4>
<table class="standard-table"> <tbody> <tr> <th>Kategorie</th> <th>CSS Wert<br> <span style="font-size: x-small;">Mouseover zum Testen</span></th> <th> </th> <th>Beschreibung</th> </tr> <tr style="cursor:auto"> <td rowspan="3">Allgemein</td> <td><code>auto</code></td> <td> </td> <td>Der Browser bestimmt aufgrund des aktuellen Kontextes, welcher Cursor angezeigt wird.<br> Wenn der Mauszeiger sich zum Beispiel über dem Text befindet, wird der <code>text</code> Cursor angezeigt.</td> </tr> <tr style="cursor:default"> <td><code>default</code></td> <td><img alt="default.gif" class="internal default" src="/@api/deki/files/3438/=default.gif"></td> <td>Standard Cursor. Üblicherweise durch ein Pfeil dargestellt.</td> </tr> <tr style="cursor:none"> <td><code>none</code></td> <td> </td> <td>Es wird kein Cursor wird angezeigt.</td> </tr> <tr style="cursor:context-menu"> <td rowspan="5" style="cursor:auto">Links &amp; Status</td> <td><code>context-menu</code></td> <td><img alt="context-menu.png" class="internal default" src="/@api/deki/files/3461/=context-menu.png"></td> <td>Ein Kontextmenü wird unter dem Cursor angezeigt.<br> Unter Windows nicht verfügbar. {{ Bug("258960") }}</td> </tr> <tr style="cursor:help"> <td><code>help</code></td> <td><img alt="help.gif" class="internal default" src="/@api/deki/files/3442/=help.gif"></td> <td>Zeigt an, dass Hilfe verfügbar ist.</td> </tr> <tr style="cursor:pointer"> <td><code>pointer</code></td> <td><img alt="pointer.gif" class="internal default" src="/@api/deki/files/3449/=pointer.gif"></td> <td>Wird zum Beispiel angezeigt, wenn der Mauszeiger sich über Links befindet. Üblicherweise durch eine Hand dargestellt.</td> </tr> <tr style="cursor:progress"> <td><code>progress</code></td> <td><img alt="progress.gif" class="internal default" src="/@api/deki/files/3450/=progress.gif"></td> <td>Zeigt an, dass das Programm im Hintergrund arbeitet und der Benutzer kann, anders als bei <code>wait</code>, weiterhin mit der Oberfläche arbeiten.</td> </tr> <tr style="cursor:wait"> <td><code>wait</code></td> <td><img alt="wait.gif" class="internal default" src="/@api/deki/files/3457/=wait.gif"></td> <td>Zeigt an, dass das Programm arbeitet. Manchmal auch durch eine Sanduhr oder eine Uhr dargestellt.</td> </tr> <tr style="cursor:cell"> <td rowspan="4" style="cursor:auto">Auswahl</td> <td><code>cell</code></td> <td><img alt="cell.gif" class="internal default" src="/@api/deki/files/3434/=cell.gif"></td> <td>Zeigt an, dass Zellen ausgewählt werden können.</td> </tr> <tr style="cursor:crosshair"> <td><code>crosshair</code></td> <td><img alt="crosshair.gif" class="internal default" src="/@api/deki/files/3437/=crosshair.gif"></td> <td>Ein Kreuz, das oft zur Auswahl eines Bereiches in Bildern verwendet wird.</td> </tr> <tr style="cursor:text"> <td><code>text</code></td> <td><a href="/@api/deki/files/3457/=wait.gif"><img alt="text.gif" class="internal default" src="/@api/deki/files/6396/=text.gif"></a></td> <td>Zeigt an, dass der Text ausgewählt werden kann.</td> </tr> <tr style="cursor:vertical-text"> <td><code>vertical-text</code></td> <td><img alt="vertical-text.gif" class="internal default" src="/@api/deki/files/3456/=vertical-text.gif"></td> <td>Zeigt an, dass vertikaler Text ausgewählt werden kann.</td> </tr> <tr style="cursor:alias"> <td rowspan="5" style="cursor:auto">Drag and drop</td> <td><code>alias</code></td> <td><img alt="alias.gif" class="internal default" src="/@api/deki/files/3432/=alias.gif"></td> <td>Zeigt an, dass ein Tastenkürzel vorhanden ist.</td> </tr> <tr style="cursor:copy"> <td><code>copy</code></td> <td><img alt="copy.gif" class="internal default" src="/@api/deki/files/3436/=copy.gif"></td> <td>Zeigt an, dass etwas kopiert werden kann.</td> </tr> <tr style="cursor:move"> <td><code>move</code></td> <td><img alt="move.gif" class="internal default" src="/@api/deki/files/3443/=move.gif"></td> <td>Zeigt an, dass das Objekt bewegt werden kann.</td> </tr> <tr style="cursor:no-drop"> <td><code>no-drop</code></td> <td colspan="2"><img align="left" alt="no-drop.gif" class="internal lwrap" src="/@api/deki/files/3445/=no-drop.gif">Zeigt an, dass an der aktuellen Stelle nichts hinein gezogen werden darf.<br> {{ bug("275173") }} unter Windows ist <code>no-drop</code> gleich wie <code>not-allowed</code>.</td> </tr> <tr style="cursor:not-allowed"> <td><code>not-allowed</code></td> <td><img alt="not-allowed.gif" class="internal default" src="/@api/deki/files/3446/=not-allowed.gif"></td> <td>Zeigt an, dass hier etwas nicht erlaubt ist.</td> </tr> <tr style="cursor:all-scroll"> <td rowspan="15" style="cursor:auto">Skalierung &amp; Scrollen</td> <td><code>all-scroll</code></td> <td><img alt="all-scroll.gif" class="internal default" src="/@api/deki/files/3433/=all-scroll.gif"></td> <td>Zeigt an, dass etwas in alle Richtungen gescrollt werden kann.<br> {{ bug("275174") }} unter Windows ist <code>all-scroll</code> gleich wie <code>move</code>.</td> </tr> <tr style="cursor:col-resize"> <td><code>col-resize</code></td> <td><img alt="col-resize.gif" class="internal default" src="/@api/deki/files/3435/=col-resize.gif"></td> <td>Zeigt an, dass das Element bzw. die Spalte horizontal skaliert werden kann. Meistens als Pfeile dargestellt, die nach rechts und links zeigen und in der Mitte einen Trennbalken haben.</td> </tr> <tr style="cursor:row-resize"> <td><code>row-resize</code></td> <td><img alt="row-resize.gif" class="internal default" src="/@api/deki/files/3451/=row-resize.gif" style=""></td> <td>Zeigt an, dass das Element bzw. die Zeile vertikal skaliert werden kann. Meistens als Pfeile dargestellt, die nach unten und oben zeigen und in der Mitte einen Trennbalken haben.</td> </tr> <tr style="cursor:n-resize"> <td><code>n-resize</code></td> <td><img alt="6-resize.gif" class="internal default" src="/@api/deki/files/6394/=6-resize.gif"></td> <td rowspan="8">Zeigt an, dass von einer Ecke aus skaliert werden kann. Der <code>se-resize</code> Cursor wird zum Beispiel benutzt, wenn, von der unteren rechten Ecke aus, etwas bewegt/skaliert werden soll.</td> </tr> <tr style="cursor:e-resize"> <td><code>e-resize</code></td> <td><img alt="3-resize.gif" class="internal default" src="/@api/deki/files/6392/=3-resize.gif"></td> </tr> <tr style="cursor:s-resize"> <td><code>s-resize</code></td> <td><img alt="6-resize.gif" class="internal default" src="/@api/deki/files/6394/=6-resize.gif"></td> </tr> <tr style="cursor:w-resize"> <td><code>w-resize</code></td> <td><img alt="3-resize.gif" class="internal default" src="/@api/deki/files/6392/=3-resize.gif"></td> </tr> <tr style="cursor:ne-resize"> <td><code>ne-resize</code></td> <td><img alt="1-resize.gif" class="internal default" src="/@api/deki/files/6391/=1-resize.gif"></td> </tr> <tr style="cursor:nw-resize"> <td><code>nw-resize</code></td> <td><img alt="4-resize.gif" class="internal default" src="/@api/deki/files/6393/=4-resize.gif"></td> </tr> <tr style="cursor:se-resize"> <td><code>se-resize</code></td> <td><img alt="4-resize.gif" class="internal default" src="/@api/deki/files/6393/=4-resize.gif"></td> </tr> <tr style="cursor:sw-resize"> <td><code>sw-resize</code></td> <td><img alt="1-resize.gif" class="internal default" src="/@api/deki/files/6391/=1-resize.gif"></td> </tr> <tr style="cursor:ew-resize"> <td><code>ew-resize</code></td> <td><img alt="3-resize.gif" class="internal default" src="/@api/deki/files/6392/=3-resize.gif"></td> <td rowspan="4">Zeigt an, dass in zwei Richtungen (bidirektional) skaliert werden kann.</td> </tr> <tr style="cursor:ns-resize"> <td><code>ns-resize</code></td> <td><img alt="6-resize.gif" class="internal default" src="/@api/deki/files/6394/=6-resize.gif"></td> </tr> <tr style="cursor: nesw-resize;"> <td><code>nesw-resize</code></td> <td><img alt="1-resize.gif" class="internal default" src="/@api/deki/files/6391/=1-resize.gif"></td> </tr> <tr style="cursor: nwse-resize;"> <td><code>nwse-resize</code></td> <td><img alt="4-resize.gif" class="internal default" src="/@api/deki/files/6393/=4-resize.gif"></td> </tr> </tbody>
</table>
<h4 id="Mozilla_Erweiterungen">Mozilla Erweiterungen</h4>
<table class="standard-table"> <tbody> <tr style="cursor:-moz-grab"> <td><code><a href="/de/CSS/-moz-grab" style="cursor:-moz-grab!important" title="de/CSS/-moz-grab">-moz-grab</a></code></td> <td><img align="left" alt="grab.gif" src="/@api/deki/files/3440/=grab.gif" style="width: 26px; height: 26px;"> Zeigt an, dass das Element angefasst werden kann.</td> <td colspan="2" rowspan="4" style="cursor:auto"> <p>Diese Cursor sind für öffentliche Webseiten nicht zu empfehlen.</p> <p>Die Benutzung von <a href="/de/Verwendung_von_URL_Werten_für_die_cursor_Eigenschaft" title="de/Verwendung_von_URL_Werten_für_die_cursor_Eigenschaft">benutzerdefinerten Bildern</a> für den Cursor bietet sich für eine browserübergreifende Lösung eher an.</p> <p>Im Safari (Webkit) existieren gleichnamige Eigenschaften mit dem Präfix <code>-webkit-</code>.</p> </td> </tr> <tr style="cursor:-moz-grabbing"> <td><code><a href="/de/CSS/-moz-grabbing" style="cursor:-moz-grabbing!important" title="de/CSS/-moz-grabbing">-moz-grabbing</a></code></td> <td><img align="left" alt="grabbing.gif" src="/@api/deki/files/3441/=grabbing.gif" style="width: 26px; height: 26px;"> Zeigt an, dass das Element gerade angefasst wird.</td> </tr> <tr style="cursor:-moz-zoom-in"> <td><code><a href="/de/CSS/-moz-zoom-in" style="cursor:-moz-zoom-in!important" title="de/CSS/-moz-zoom-in">-moz-zoom-in</a></code></td> <td><img align="left" alt="zoom-in.gif" src="/@api/deki/files/3459/=zoom-in.gif" style="width: 26px; height: 26px;"> Zeigt an, dass ein Element vergrößert werden kann. {{ bug("204841") }}</td> </tr> <tr style="cursor:-moz-zoom-out"> <td><code><a href="/de/CSS/-moz-zoom-out" style="cursor:-moz-zoom-out!important" title="de/CSS/-moz-zoom-out">-moz-zoom-out</a></code></td> <td><img align="left" alt="zoom-out.gif" src="/@api/deki/files/3460/=zoom-out.gif" style="width: 26px; height: 26px;"> Zeigt an, dass ein Element verkleinert werden kann. {{ bug("204841") }}</td> </tr> </tbody>
</table>
<h3 id="Hinweise">Hinweise</h3>
<div class="geckoVersionNote"> <p>{{ gecko_callout_heading("2.0") }}</p> <p>Unterstützung zum Laden eines Cursors von einer URI wurde für Mac OS X in Gecko 2.0 eingeführt. Vorherige Versionen unterstützen keine URI-Angaben unter OS X.</p>
</div>
<h3 id="Beispiele">Beispiele</h3>
<p><a class="external" href="http://developer.mozilla.org/samples/cssref/cursor.html" rel="external">Live Beispiel</a></p>
<pre>.foo { cursor: crosshair; }

.bar { cursor: move;  cursor: cell; }  /* Benutze move wenn cell nicht unterstützt wird. */ 

.baz { url(hyper.cur), auto }          /* Standardwert als Fallback, damit ein Cursor gezeigt werden kann.*/
</pre>
<h3 id="Browser_Kompatibilit.C3.A4t">Browser Kompatibilität</h3>
<table class="compat-table"> <tbody> <tr> <th>Feature</th> <th>Chrome (WebKit)</th> <th>Firefox (Gecko)</th> <th>Internet Explorer</th> <th>Opera</th> <th>Safari</th> </tr> <tr> <td><code>auto | crosshair | default | move | text | wait | help | n-resize | e-resize | s-resize | w-resize | ne-resize | nw-resize | se-resize | sw-resize</code></td> <td>1.0</td> <td>1.0 (1.0)</td> <td>4.0</td> <td>7.0</td> <td>1.2</td> </tr> <tr> <td><code>hand </code>{{ non-standard_inline() }}(für diesen Zweck verwendet man<code> pointer</code> )</td> <td>{{ CompatNo() }}</td> <td>{{ CompatNo() }}</td> <td>4.0</td> <td>{{ CompatNo() }}</td> <td>{{ CompatNo() }}</td> </tr> <tr> <td><code>pointer | progress</code></td> <td>1.0</td> <td>1.0 (1.0|1.7)</td> <td>6.0</td> <td>7.x</td> <td>1.2 | 3.0</td> </tr> <tr> <td><code>url()</code>   See <a class="internal" href="/en/CSS/Using_URL_values_for_the_cursor_property" title="en/Using URL values for the cursor property">Using URL values [en]</a></td> <td>1.0 (523)</td> <td>1.5 (1.8)</td> <td>6.0</td> <td>{{ CompatNo() }}</td> <td>3.0</td> </tr> <tr> <td><code>not-allowed | no-drop | vertical-text | all-scroll | col-resize | row-resize</code></td> <td>1.0 (522)</td> <td>1.5 (1.8)</td> <td>6.0</td> <td>10.6</td> <td>3.0</td> </tr> <tr> <td><code>alias | </code><code>cell | copy | ew-resize | ns-resize | nesw-resize | nwse-resize | </code>[1] <code>context-menu</code></td> <td>1.0 (522)</td> <td>1.5 (1.8)</td> <td>{{ CompatNo() }}</td> <td>10.6</td> <td>3.0 [2]</td> </tr> <tr> <td><code>none</code></td> <td>5.0 (533)</td> <td>3.0 (1.9)</td> <td>9.0</td> <td>{{ CompatNo() }}</td> <td>5.0 [2]</td> </tr> <tr> <td><code>inherit</code></td> <td>1.0</td> <td>1.0</td> <td>8.0</td> <td>9.0</td> <td>1.2</td> </tr> <tr> <td><code>zoom-in | zoom-out</code></td> <td>1.0 (522) {{ property_prefix("-webkit-") }}</td> <td>1.0 (1.4) {{ property_prefix("-moz-") }}</td> <td>{{ CompatNo() }}</td> <td>11.6</td> <td>3.0 {{ property_prefix("-webkit-") }}</td> </tr> </tbody>
</table>
<p>[1] Mozilla and WebKit verwenden<code> context-menu </code>nicht in Windows, Opera schon.<br> [2] In Safari funktioniert<code> alias, cell, copy, none </code>nicht in Windows (was ist mit Mac?).</p><h3 id="Spezifikation">Spezifikation</h3>
<ul> <li><a class="external" href="http://www.w3.org/TR/CSS21/ui.html#cursor-props" title="http://www.w3.org/TR/CSS21/ui.html#cursor-props">CSS 2.1 User Interface #cursor</a></li> <li><a class="external" href="http://www.w3.org/TR/css3-ui/#cursor">CSS 3 User Interface #cursor</a></li> <li><a class="external" href="http://msdn.microsoft.com/en-us/library/aa358795.aspx">Cursor Property (MSDN)</a></li>
</ul>
<h3 id="Siehe_auch">Siehe auch</h3>
<ul> <li><a href="/de/Verwendung_von_URL_Werten_für_die_cursor_Eigenschaft" title="de/Verwendung_von_URL_Werten_für_die_cursor_Eigenschaft">Verwendung von URL Werten für die cursor Eigenschaft</a></li> <li><a href="/en/Giving_'cursor'_a_Hand" title="en/Giving_'cursor'_a_Hand">Giving 'cursor' a Hand</a> (en)</li> <li><a href="/de/CSS/pointer-events" title="de/CSS/pointer-events"><code>pointer-events</code></a></li>
</ul>
<p>{{ languages( { "en": "en/CSS/cursor", "fr": "fr/CSS/cursor", "pl": "pl/CSS/cursor", "es": "es/CSS/cursor" } ) }}</p>
Zu dieser Version zurücksetzen