Zusammenfassung der Eigenschaften und Verwendung von CSS-Cursoren

Das Cursor-Attribut gibt den Typ (die Form) des anzuzeigenden Cursors an. Diese Eigenschaft definiert die Cursorform, die verwendet wird, wenn der Mauszeiger innerhalb der Grenzen eines Elements platziert wird (obwohl CSS2.1 nicht definiert, welche Grenzen diesen Bereich bestimmen).

Wenn wir DIV-CSS entwerfen, werden wir auf die Steuerung des Mauszeigers innerhalb des Objekts stoßen, z. B. wenn die Maus durch den Zeiger verläuft und sich in eine Fingerform verwandelt Stil-Cursor-Steuerung. Zusätzlich zum standardmäßigen Mauszeigerstil des Systems können Sie das Bild über CSS als Mauszeiger festlegen. Es ist üblich, dass einige Websites verschiedene kleine Bildstile für den Mauszeiger haben CSS-Cursor.

1. CSS-Cursor-Attribut

Cursor-Attribut gibt den Typ (Form) des anzuzeigenden Cursors an

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

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

Beispielcode:

html{cursor: url("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-Standardcursorstil kann durch andere Eigenschaften (z. B. Zeiger/Standard usw.) ersetzt werden!

3. Cursor-Mausstil?

Auto: normale Maus

Fadenkreuz: Fadenkreuz

Standard: Standardmaus

Zeiger: Zeigermaus (Hand, zwei Wörter wurden geschrieben, um sich um IE5 zu kümmern, der nur Hand erkennt.)

Bewegen: Bewegen Sie die Maus

4 Einstellungen Bildprobleme

Einige Dinge sind zu beachten: 1. Die Bildadresse ist ein absoluter Pfad, 2. Die Bildgröße beträgt am besten 32*32, die geparste Größe ist jedoch in jedem Browser unterschiedlich

5.

CSS-Cursor-Mausform

URL 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)

Auto Standard. Der vom Browser gesetzte Cursor.

Fadenkreuz Der Cursor wird als Fadenkreuz dargestellt.

Zeiger Der Cursor wird als Zeiger (eine Hand) dargestellt, der einen Link anzeigt.

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

6.

Detaillierte Erklärung des Beispielcodes des Cursor-Attributs in CSS

Cursor-Attribut von CSS

Heute habe ich das Cursor-Attribut von CSS gelernt. Dies ist mein erster Blog. Fassen wir es zusammen. Das

cursor-Attribut wird verwendet, um den Anzeigestil des Cursors zu steuern. Die möglichen Werte sind wie folgt:

cursor:url()*|
{auto|default|pointer|crosshair|text|vertical-text|help|not-allowed|no-drop|move|e-reszie|s-resize|w-resize|w-resize|n-resize|all-scroll|ne-resize|se-resize|nw-resize|sw-resize|col-resize|row-resize|}

* bedeutet, dass mindestens einer dieser Werte und Sie geschrieben werden kann einen Wert in {} nach der URL auswählen.

Verwandte Fragen und Antworten:

1.

Javascript – Nach dem Binden des window.resize-Ereignisses an ein Element, das Cursor-Attribut zuvor eingestellt.

2.

vim – Zuordnung von zum Umschalten des Cursors zwischen geteilten Fenstern?

[Verwandte Empfehlungen 】

1.

php.cn Dugu Jiujian (2) - CSS-Video-Tutorial

2.

Positionieren Sie den Mausfokus am Ende des Textfelds

Das obige ist der detaillierte Inhalt vonZusammenfassung der Eigenschaften und Verwendung von CSS-Cursoren. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!