Maison  >  Article  >  interface Web  >  Exemple d'utilisation de CSS pour implémenter une tornade à l'aide de styles de curseur personnalisés

Exemple d'utilisation de CSS pour implémenter une tornade à l'aide de styles de curseur personnalisés

高洛峰
高洛峰original
2017-03-04 10:00:431537parcourir

L'environnement de test est le navigateur Chrome

Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, comme Gecko) Chrome/43.0.2357.132 Safari/537.36

css Style

p
{
  cursor:url('1.jpg'),pointer;
}
HTML
<body>
  <p style="width:100px;height:100px;background-color:red;"></p>
</body>

Lorsque la souris est placée sur p, le curseur se transformera en le motif que vous avez spécifié

* Notes

Assurez-vous que l'image personnalisée est suffisamment petite, voici 16*16

Différents navigateurs prennent en charge différents formats d'image, veuillez le trouver vous-🎜>

cursor:url('1.jpg'),pointer 1.jpg ici devrait être le même que ; Le fichier html actuel est dans le répertoire de même niveau, et un pointeur est nécessaire. Il s'agit d'un plan de sauvegarde lorsque l'image personnalisée ne peut pas être appliquée. Ce serait une erreur de ne pas l'écrire dans ce test.

L'implémentation du CSS ci-dessus à l'aide de styles de curseur personnalisés_Escape tornado est tout le contenu partagé par l'éditeur. J'espère qu'il pourra vous donner une référence, et j'espère également que tout le monde soutiendra le site Web PHP chinois.

Pour plus d'articles connexes sur des exemples de CSS utilisant des styles de curseur personnalisés pour réaliser une tornade souterraine, veuillez faire attention au site Web PHP chinois !

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn