zl程序教程

您现在的位置是:首页 >  前端

当前栏目

CSS 改变鼠标样式(大全)[通俗易懂]

CSS 通俗易懂 改变 大全 样式 鼠标
2023-06-13 09:11:55 时间

大家好,又见面了,我是你们的朋友全栈君。

前端经常会用到改变鼠标的样式来达到更好的页面效果,比如经常会使用到改变成小手,拖拽时改变成移动拖拽的鼠标样式,可每次都需要查阅资料来完成代码,在此做下详细总结:

使用方法:

    <span style="cursor:auto">Auto</span>
    <span style="cursor:crosshair">Crosshair</span>
    <span style="cursor:default">Default</span>
    <span style="cursor:pointer">Pointer</span>
    <span style="cursor:move">Move</span>
    <span style="cursor:e-resize">e-resize</span>
    <span style="cursor:ne-resize">ne-resize</span>
    <span style="cursor:nw-resize">nw-resize</span>
    <span style="cursor:n-resize">n-resize</span>
    <span style="cursor:se-resize">se-resize</span>
    <span style="cursor:sw-resize">sw-resize</span>
    <span style="cursor:s-resize">s-resize</span>
    <span style="cursor:w-resize">w-resize</span>
    <span style="cursor:text">text</span>
    <span style="cursor:wait">wait</span>
    <span style="cursor:help">help</span>

发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/138403.html原文链接:https://javaforall.cn