<style>
div{width:100;height:50;float:left;border:1px solid red;margin:1px;}
</style>
<div style="cursor:auto">auto</div>
<div style="cursor:default">default</div>
<div style="cursor:pointer">pointer</div>
<div style="cursor:hand">hand</div>
<div style="cursor:wait">wait</div>
<div style="cursor:text">text</div>
<div style="cursor:vertical-text">vertical-text</div>
<div style="cursor:no-drop">no-drop</div>
<div style="cursor:not-allowed">not-allowed</div>
<div style="cursor:help">help</div>
<div style="cursor:all-scroll">all-scroll</div>
<div style="cursor:move">move</div>
<div style="cursor:crosshair">crosshair</div>
<div style="cursor:e-resize">e-resize</div>
<div style="cursor:n-resize">n-resize</div>
<div style="cursor:nw-resize">nw-resize</div>
<div style="cursor:w-resize">w-resize</div>
<div style="cursor:s-resize">s-resize </div>
<div style="cursor:se-resize">se-resize</div>
<div style="cursor:sw-resize">sw-resize</div>

cursor样式实例

效果如下图:

详细说明:

https://www.w3school.com.cn/jsref/prop_style_cursor.asp

css 光标的更多相关文章

  1. CSS光标cursor

    前面的话 在浏览器中,光标对于提供交互反馈很有用.通过在不同的场景中改变光标,就能赋予其不同的含义 定义 cursor光标 值: [<uri>,]*[auto | default | po ...

  2. CSS光标属性一览表

    光标类型 CSS 把你的光标放到相应文字上查看效果 要注意光标的实际效果依赖于用户的系统设置,与你在这里看到的效果并不一定一致. 十字准心 cursor: crosshair; 手 cursor: p ...

  3. 测开之路九十五:css进阶之光标和溢出内容处理

    光标样式:cursor 准备文字 css 溢出内容处理:overflow,默认溢出部分是显示 先把内容放到盒子里面 正常显示 不显示溢出内容 显示为滚动条 自动处理 css /* 光标样式 */p{ ...

  4. CSS active选择器与CSS hover选择器

    <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...

  5. 不可思议的纯CSS导航栏下划线跟随效果

    先上张图,如何使用纯 CSS 制作如下效果? 在继续阅读下文之前,你可以先缓一缓.尝试思考一下上面的效果或者动手尝试一下,不借助 JS ,能否巧妙的实现上述效果. OK,继续.这个效果是我在业务开发的 ...

  6. [web建站] 优课急送《零基础快速学习建站》视频+课件【价值399元】

    [课程介绍]你想快速建一个网站出来吗?你想从什么都不懂到一两天出一个漂漂亮亮的站吗?你想完成领导交给你的任务找人建站吗?你想自己建站来创业吗?你想学会建站之后,利用给别人建站来赚钱吗?你想建一个跟某个 ...

  7. jQuery EasyUI API - Base - Draggable [原创汉化官方API]

    最近在学习jQuery EasyUI,发现中文的文档好少,部分文档不错但它是鸟语的,为了大家也为了自己学习吧,汉化做一下笔记. 有没有说清楚的,或者翻译不正确的地方还请大家谅解指出.. 由于工作时间原 ...

  8. jQuery UI API - 可拖拽小部件(Draggable Widget)(转)

    所属类别 交互(Interactions) 用法 描述:允许使用鼠标移动元素. 版本新增:1.0 依赖: UI 核心(UI Core) 部件库(Widget Factory) 鼠标交互(Mouse I ...

  9. EasyUI Draggable 可拖动

    通过 $.fn.draggable.defaults 重写默认的 defaults. 用法 通过标记创建可拖动(draggable)元素. <div id="dd" clas ...

随机推荐

  1. 【MySQL】自增步长调整

    mysql> show variables like '%increment%'; +-----------------------------+-------+ | Variable_name ...

  2. c#执行sql超时

    超时分为多种,SqlConnection有超时选项, SqlDataAdapter也有超时选项设置如下: SqlConnection:就用链接字符串给予的Timeout设置就行单位秒: SqlData ...

  3. Nginx 核心配置-location的匹配案例实战篇

    Nginx 核心配置-location的匹配案例实战篇 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.location语法规则介绍 在没有使用正则表达式的时候,nginx会先在 ...

  4. 让istio中的jaeger跑起来

    现在的水平,仅止于让它跑起来.:) 同样的环境,microk8s+istio. 步骤如下: 一,使用kubectl get pod -n istio-system查看所有istio的POD运行正常. ...

  5. 201871010132——张潇潇《面向对象程序设计JAVA》第二周学习总结

    项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/ 这个作业的要求在哪里 https://www.cnblogs.com/nwnu-daizh/p ...

  6. windows10下Docker开启nginx服务访问页面没有反应

    网址不要输入localhost,而是输入docker quickstart terminal登陆成功后给你的ip地址.

  7. vue大文件上传控件选哪个好?

    需求: 项目要支持大文件上传功能,经过讨论,初步将文件上传大小控制在20G内,因此自己需要在项目中进行文件上传部分的调整和配置,自己将大小都以20G来进行限制. PC端全平台支持,要求支持Window ...

  8. yugabyte 安装pg_hashids 扩展

    主要目的比较简单,就是测试下yugabyte 对于pg 扩展的支持,今天在测试plv8的时候发现有问题(以及提交issue了,很期待官方的解决) 所以测试下一个其他的扩展,看看是否像官方介绍的那样 环 ...

  9. Checking Types Against the Real World in TypeScript

    转自:https://www.olioapps.com/blog/checking-types-real-world-typescript/ This is a follow-up to Type-D ...

  10. 洛谷 P1965 转圈游戏

    洛谷 P1965 转圈游戏 传送门 思路 每一轮第 0 号位置上的小伙伴顺时针走到第 m 号位置,第 1 号位置小伙伴走到第 m+1 号位置,--,依此类推,第n − m号位置上的小伙伴走到第 0 号 ...