CSS鼠标指针cursor样式
参考来源:W3SCHOOL
有时我们需要在CSS布局时设定特定的鼠标指针样式,这时可以通过设定cursor来实现:
url: 需使用的自定义光标的 URL。
注释:请在此列表的末端始终定义一种普通的光标,以防没有由 URL 定义的可用光标;
default: 默认光标(通常是一个箭头);
auto: 默认。浏览器设置的光标;
crosshair: 光标呈现为十字线;
pointer: 光标呈现为指示链接的指针(一只手);
move: 此光标指示某对象可被移动;
e-resize: 此光标指示矩形框的边缘可被向右(东)移动;
ne-resize: 此光标指示矩形框的边缘可被向上及向右移动(北/东);
nw-resize: 此光标指示矩形框的边缘可被向上及向左移动(北/西);
n-resize: 此光标指示矩形框的边缘可被向上(北)移动;
se-resize: 此光标指示矩形框的边缘可被向下及向右移动(南/东);
sw-resize: 此光标指示矩形框的边缘可被向下及向左移动(南/西);
s-resize: 此光标指示矩形框的边缘可被向下移动(南);
w-resize: 此光标指示矩形框的边缘可被向左移动(西);
text: 此光标指示文本;
wait: 此光标指示程序正忙(通常是一只表或沙漏);
help: 此光标指示可用的帮助(通常是一个问号或一个气球);
例如:<span style="cursor:auto">
在线测试:在线测试地址
CSS鼠标指针cursor样式的更多相关文章
- 【css】cursor鼠标指针光标样式知识整理
在前端开发中,我们经常需要对对象鼠标指针光标进行控制,比如鼠标经过超链接时变成手指形状.在这里整理一下cursor鼠标指针光标样式的知识,记录与方便以后查找. 1.常用cursor光标 div( cu ...
- 鼠标指针光标样式css cursor default pointer hand url
一.cursor语法与结构 1.cursor语法:cursor : auto | crosshair | default | hand | move | help | wait | text | w- ...
- CSS---cursor 鼠标指针光标样式(形状)
url 需使用的自定义光标的 URL. 注释:请在此列表的末端始终定义一种普通的光标,以防没有由 URL 定义的可用光标. default 默认光标(通常是一个箭头) auto 默认.浏览器设置的光标 ...
- css Cursor:url()自定义鼠标指针样式为图片
css自定义鼠标指针样式为图片Cursor:url()的使用,今天在项目中,要用到自定义鼠标样式,格式: css:{cursor:url('绝对路径的图片(格式:cur,ico)'),-moz-zoo ...
- CSS/HTML 改变鼠标指针形状
改变鼠标指针形状的方法有两种:第一种:用的来改变鼠标指针形状.另一种是:利用第三方控件的方法,而我自己最常用的是第一种:用css样式表来改变鼠标指针形状 我们先来看第一种:用来改变鼠标指针形状. 有些 ...
- 使用自定义的鼠标图标 --- cursor url
前段时间在项目中遇到过 自定义鼠标图标 这一需求.由于一般我们用的鼠标样式大都是固定的几种,而 自定义鼠标图标 不是很常用到,所以对这一小知识点进行总结,以防忘记. 自定义鼠标图标 自定义鼠标图标 即 ...
- C# 设置鼠标指针
鼠标光标指针的使用 #region 设置鼠标指针 //设置鼠标指针 //Cursor cus = new Cursor(@"C:\Users\Public\Pictures\Sample P ...
- cursor CSS属性定义鼠标指针悬浮在元素上时的外观。
1 1 cursor CSS属性定义鼠标指针悬浮在元素上时的外观. https://developer.mozilla.org/zh-CN/docs/Web/CSS/cursor 概述 cursor ...
- 利用Css3样式属性Cursor来更换自定义个性化鼠标指针(光标)
现而今,我们纵向的回顾整个大前端的历史,不难发现,人们对前端的审美要求越来越高,越来越严苛,与此同时,人们对追求美的体验是也极致的,从理性到感性,从平面到几何,从现实到虚拟,所以从某种角度来说,作为前 ...
随机推荐
- 系统提供的dispatch方法
h1, h2, h3, h4, h5, h6, p, blockquote { margin: 0; padding: 0 } body { font-family: "Helvetica ...
- mysql5.5升级5.7(1)
卸载旧版本mysql 当然要记得备份数据库数据啦 1.查看需要卸载的部分: rpm -qa |grep -i mysql 2.开始卸载: yum remove mysql* 接下来是安装新版mysql ...
- python3基础3
# 匿名函数: bbb = lambda a, b: a + b print(bbb(1,1)) # 函数 def add(a=None, b=None): """ 接收 ...
- JavaSE 学习笔记07丨IO流
Chapter 13. IO流 13.1 File类 java.io.File类是文件(file)和目录(文件夹)(directory)路径名(path)的抽象表示,主要用于文件和目录的创建.查找和删 ...
- CET-6备考丨词组、佳句积累
一.片段积累 (2020/09/17) 近三年 CET6 - 翻译 Phrases or Expressions Notes drive to commute to and from work 开车上 ...
- 【mq读书笔记】mq producer启动流程
创建MQClientInstance实例.这里有个实例缓存 clienrId为客户端IP+instance+(unitname)注意到之前把instance替换为进程id,是为了instance为默认 ...
- [BUGCASE]Webpack打包报JavaScript堆内存泄漏的错误
一.问题描述 执行npm run build之后报错: 报错信息: FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript he ...
- 腾讯云linux系统部署项目无法通过外网访问
最近尝试使用了一下腾讯去的linux系统服务器,但是却遇到各种问题,下面记录的问题是项目部署完成后却无法通过外网访问. 服务器:腾讯云 系统 :CentOS 8.0 64位 处理思路:通过度娘百般摸索 ...
- SpringCloud 源码系列(1)—— 注册中心 Eureka(上)
Eureka 是 Netflix 公司开源的一个服务注册与发现的组件,和其他 Netflix 公司的服务组件(例如负载均衡.熔断器.网关等)一起,被 Spring Cloud 整合为 Spring C ...
- 微信小程序里如何使用npm?小程序集成友盟举例
1.执行npm初始化指令 小程序根目录,命令执行如下指令: npm init 执行后会让加载项目初始信息,具体截图如下: 2.执行安装npm包指令 在这我们举个例子,以接入友盟统计SDK为例,执行命令 ...