So legen Sie die Form des Mauszeigers mit CSS fest-CSS-Tutorial-php.cn

So legen Sie die Form des Mauszeigers mit CSS fest

王林

Freigeben： 2023-01-03 09:25:17

Original

3905 Leute haben es durchsucht

So legen Sie die Form des Mauszeigers in CSS fest: Sie können das Cursor-Attribut verwenden, um sie festzulegen, z. B. [crosshair], was bedeutet, dass Sie den Cursor auf setzen eine Fadenkreuzform.

So legen Sie die Form des Mauszeigers mit CSS fest

Die Betriebsumgebung dieses Artikels: Windows 10-System, CSS 3, Thinkpad T480-Computer.

Attributeinführung: Das

cursor-Attribut definiert die Cursorform, die verwendet wird, wenn der Mauszeiger innerhalb der Grenzen eines Elements platziert wird.

Gemeinsame Attributwerte:

Text Dieser Cursor zeigt Text an.
Warten 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).
auto Standard. Der vom Browser gesetzte Cursor.
Fadenkreuz Der Cursor erscheint als Fadenkreuz.
Zeiger Der Cursor wird als Zeiger (eine Hand) dargestellt, der den Link anzeigt

So legen Sie die Form des Mauszeigers fest:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网</title> 
</head>
<body>
<p>请把鼠标移动到单词上，可以看到鼠标指针发生变化：</p>
<span style="cursor:auto">auto</span><br>
<span style="cursor:crosshair">crosshair</span><br>
<span style="cursor:default">default</span><br>
<span style="cursor:e-resize">e-resize</span><br>
<span style="cursor:help">help</span><br>
<span style="cursor:move">move</span><br>
<span style="cursor:n-resize">n-resize</span><br>
<span style="cursor:ne-resize">ne-resize</span><br>
<span style="cursor:nw-resize">nw-resize</span><br>
<span style="cursor:pointer">pointer</span><br>
<span style="cursor:progress">progress</span><br>
<span style="cursor:s-resize">s-resize</span><br>
<span style="cursor:se-resize">se-resize</span><br>
<span style="cursor:sw-resize">sw-resize</span><br>
<span style="cursor:text">text</span><br>
<span style="cursor:w-resize">w-resize</span><br>
<span style="cursor:wait">wait</span><br>
</body>
</html>

Nach dem Login kopieren

Verwandtes Lernen: CSS-Tutorial

Das obige ist der detaillierte Inhalt vonSo legen Sie die Form des Mauszeigers mit CSS fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!