Detaillierte Erläuterung des CSS-Cursor-URL-Verwendungsformats

CSS-Cursor-URL-Verwendungsformat: css:{cursor:url('icon path'),auto;} //IE-, FF- und Chrome-Browser können verwendet werden

Beispielcode: html{cursor: url("http://ued.taobao.com/blog/wp-content/themes/taobaoued/images/cursor.ico"),auto;}

Analyse: Die vorherige URL ist ein benutzerdefinierter Maussymbolpfad und der zweite Parameter auto ist der CSS-Standard-Cursorstil, der durch andere Attribute (z. B. Zeiger/Standard usw.) ersetzt werden kann. !
(Hinweis: w3school empfiehlt, dass der zweite Parameter einen gemeinsamen Cursor definieren muss, falls der durch die URL definierte verfügbare Cursor zu einem Backup wird! Darüber hinaus kann der zweite Parameter im IE weggelassen werden)

Um das Mausanzeigesymbol anzupassen, müssen Sie die folgenden Punkte beachten

Symbolformat:

IE unterstützt die Formate cur, ani und ico. Es unterstützt weder das ani-Format noch das GIF-Animationsformat, daher ist es im Allgemeinen besser, das zu speichern Bild, auf das die URL verweist, im ICO- oder Cur-Format!

Symbolgröße:

Die empfohlene Größe des Mausbildes beträgt 32*32, andernfalls kann es zu inkonsistenten Symbolgrößen kommen!

Außerdem liegt das Problem, dass das Mausbild nicht im Browser angezeigt wird, meist in der Referenz auf den URL-Pfad des Mausbildes. Sie können es mit den absoluten bzw. relativen Pfadreferenzen versuchen.

Abschließend werden die möglichen Werte des Cursor-Attributs angehängt: (Alle gängigen Browser unterstützen die folgenden Cursor-Attribute)

Wert

Beschreibung

URL

值	描述
url	需使用的自定义光标的 URL。 注释：请在此列表的末端始终定义一种普通的光标，以防没有由 URL 定义的可用光标。
default	默认光标（通常是一个箭头）
auto	默认。浏览器设置的光标。
crosshair	光标呈现为十字线。
pointer	光标呈现为指示链接的指针（一只手）
move	此光标指示某对象可被移动。
e-resize	此光标指示矩形框的边缘可被向右（东）移动。
ne-resize	此光标指示矩形框的边缘可被向上及向右移动（北/东）。
nw-resize	此光标指示矩形框的边缘可被向上及向左移动（北/西）。
n-resize	此光标指示矩形框的边缘可被向上（北）移动。
se-resize	此光标指示矩形框的边缘可被向下及向右移动（南/东）。
sw-resize	此光标指示矩形框的边缘可被向下及向左移动（南/西）。
s-resize	此光标指示矩形框的边缘可被向下移动（北/西）。
w-resize	此光标指示矩形框的边缘可被向左移动（西）。
text	此光标指示文本。
wait	此光标指示程序正忙（通常是一只表或沙漏）。
help	此光标指示可用的帮助（通常是一个问号或一个气球）。

Die URL des zu verwendenden benutzerdefinierten Cursors.

Hinweis: Definieren Sie immer einen normalen Cursor am Ende dieser Liste, falls kein verfügbarer Cursor durch die URL definiert ist.

Standard

Standardcursor (normalerweise ein Pfeil)

automatisch

Standard. Der vom Browser gesetzte Cursor.

Fadenkreuz

Der Cursor wird als Fadenkreuz dargestellt.

Zeiger

Der Cursor erscheint als Zeiger (eine Hand), der den Link anzeigt

bewegen

Dieser Cursor zeigt an, dass ein Objekt verschoben werden kann.

E-Größe ändern

Dieser Cursor zeigt an, dass der Rand des rechteckigen Felds nach rechts (Osten) verschoben werden kann.

ne-resize

Dieser Cursor zeigt an, dass der Rand des rechteckigen Felds nach oben und nach rechts (Norden/Osten) verschoben werden kann.

nw-resize

Dieser Cursor zeigt an, dass die Kante des Rechtecks ​​nach oben und nach links (Norden/Westen) verschoben werden kann.

n-resize

Dieser Cursor zeigt an, dass der Rand des rechteckigen Felds nach oben (Norden) verschoben werden kann.

se-resize

Dieser Cursor zeigt an, dass die Kante des Rechtecks ​​nach unten und nach rechts (Süden/Osten) verschoben werden kann.

sw-resize

Dieser Cursor zeigt an, dass die Kante des Rechtecks ​​nach unten und nach links (Süden/Westen) verschoben werden kann.

s-resize

Dieser Cursor zeigt an, dass die Kante des Rechtecks ​​nach unten (Norden/Westen) verschoben werden kann.

w-resize

Dieser Cursor zeigt an, dass der Rand des rechteckigen Felds nach links (Westen) verschoben werden kann.

Text

Dieser Cursor zeigt Text an.

warte

Dieser Cursor zeigt an, dass das Programm beschäftigt ist (normalerweise eine Uhr oder eine Sanduhr).

Hilfe

Dieser Cursor zeigt verfügbare Hilfe an (normalerweise ein Fragezeichen oder eine Sprechblase).