Websiteentwicklung: CSS: Cursor

Aus Wikibooks

Zurück zu Farben | Hoch zu CSS | Vor zu Praxis

[Bearbeiten] Cursor

Es gibt verschiedene Cursor die Mittels CSS auf der eigenen Seite benutzt werden können. Diese lassen sich auf alle Elemente anwenden.

[Bearbeiten] Cursor Liste

Folgende Cursor stehen zur verfügung:

• auto (Der cursor wird automatisch vom System vergeben)
• default (Das ist der im System gewählte Cursor)
• crosshair (Fadenkreuz)
• pointer (Hand)
• text (Textcursor)
• wait (Wartecursor, der erscheint wenn ein Objekt lädt)
• help (Hilfecursor)
• move (Cursor zum bewegen von Objekten)
•  ?-resize (Verkleinerungscursor:Vordere Bezeichnung steht für Richtung):
  • Richtungen:

[Bearbeiten] Eigener Cursor

Ein eigener Cursor lässt sich aus einer Datei laden mit:

<pre>url(file.cur)</pre>

[Bearbeiten] Beispiele

Direkt in HTML:

<p style="cursor:help">Text mit Hilfecursor</p>

In einer CSS-Datei:

img {
  cursor:pointer   /*Würde für alle Bilder in <img> Tags die Hand als Cursor verwenden */
}

[Bearbeiten] Browser-Unterstützung

Die Cursor sind in folgenden Browsern nicht sichtbar:

• Opera 5 & 6
• Netscape 4

[Bearbeiten] Navigation

Zurück zu Farben | Hoch zu CSS | Vor zu Praxis