Comment définir la forme du curseur de la souris avec CSS-tutoriel CSS-php.cn

Comment définir la forme du curseur de la souris avec CSS

王林

Libérer： 2023-01-03 09:25:17

original

3857 Les gens l'ont consulté

Comment définir la forme du curseur de la souris avec CSS : vous pouvez utiliser l'attribut du curseur pour le définir, tel que [crosshair], ce qui signifie définir le curseur comme une forme de réticule.

Comment définir la forme du curseur de la souris avec CSS

L'environnement d'exploitation de cet article : système Windows 10, CSS 3, ordinateur thinkpad t480.

Introduction à l'attribut :

l'attribut curseur définit la forme du curseur utilisée lorsque le pointeur de la souris est placé dans les limites d'un élément.

Valeurs d'attribut communes :

texte Ce curseur indique du texte.
attendre Ce curseur indique que le programme est occupé (généralement une montre ou un sablier).
aide Ce curseur indique l'aide disponible (généralement un point d'interrogation ou une bulle).
auto par défaut. Le curseur défini par le navigateur.
réticule Le curseur est rendu sous forme de réticule.
pointeur Le curseur est rendu sous forme de pointeur (une main) indiquant le lien

Comment définir la forme du curseur de la souris :

<!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>

Copier après la connexion

Apprentissage associé : Tutoriel CSS

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!