English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
CSS光标属性，用于在鼠标移至某个区域或网页上的链接时定义光标类型（即鼠标指针）。
浏览器通常将鼠标指针显示在网页的任何空白部分上，带手套的手显示在任何链接或可单击的项目上，将编辑光标显示在任何文本或文本字段上。使用CSS，您可以重新定义这些属性以显示各种不同的光标。
h1 {
cursor: move;
}
p {
cursor: text;
}Testen Sie heraus‹/›以下示例显示了大多数浏览器将接受的不同光标。将鼠标指针放在输出列中的“TEST”链接上，以显示该光标。
| Ansehen | 值 | Beispiel | Ansehen |
|---|---|---|---|
| default | a:hover{cursor:default;} | Testen | |
| pointer | a:hover{cursor:pointer;} | Testen | |
| text | a:hover{cursor:text;} | Testen | |
| wait | a:hover{cursor:wait;} | Testen | |
| help | a:hover{cursor:help;} | Testen | |
| Fortschritt | a:hover{cursor:progress;} | Testen | |
| Kreuzspitze | a:hover{cursor:crosshair;} | Testen | |
| bewegen | a:hover{cursor:move;} | Testen | |
| url() | a:hover{cursor:url("custom.cur"), default;} | Testen |
AnsehenMehr Cursor»
Es kann auch vollständig benutzerdefinierte Cursor haben.
cursor-Eigenschaft behandelt eine durch Kommas getrennte Liste von Benutzerdefinierter Cursorwerten, gefolgt vonStandard-Cursor. Wenn der erste Cursor falsch spezifiziert ist oder nicht gefunden wird, wird der nächste Cursor in der Liste verwendet, bis ein verfügbarer Cursor gefunden wird.
Wird kein gültiger Benutzerdefinierter Cursor unterstützt oder von dem Browser nicht unterstützt, wird der Standardcursor am Ende der Liste verwendet.
Tipp:Das Standardformat für Cursor, die verwendet werden können, ist das .cur-Format. Sie können jedoch Online-Freeware-Software verwenden, um Bilder wie .jpg in .cur-Format umzuwandeln.
a {
cursor: url("custom.gif"), url("custom.cur"), default;
}Testen Sie heraus‹/›In dem obigen Beispiel sind custom.gif und custom.cur die benutzerdefinierten Cursor-Dateien, die auf Ihrem Server-Speicher hochgeladen wurden, und default ist der Standardcursor. Wenn der benutzerdefinierte Cursor verloren geht oder der Browser des Betrachters ihn nicht unterstützt, wird dieser Standardcursor verwendet.
Warnung:Um einen benutzerdefinierten Cursor zu deklarieren, muss er am Ende der Liste definiert werdenStandard-CursorAndernfalls wird der benutzerdefinierte Cursor nicht korrekt dargestellt.
Das ist eine Live-Demonstration des benutzerdefinierten Cursors.
Hinweis: IE9Und frühere Versionen unterstützen nur die URL-Werte für statische Cursor im .cur-Format und animierte Cursor im .ani-Format. Allerdings unterstützen Browser wie Firefox, Chrome und Safari .cur, .png, .gif und .jpg, aber nicht .ani.