博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
HTML光标样式
阅读量:6004 次
发布时间:2019-06-20

本文共 1372 字,大约阅读时间需要 4 分钟。

HTML光标样式

把你的光标放到相应文字上鼠标显示效果 
 cursor:auto;   自动
 cursor:zoom-in;   放大镜
 cursor:zoom-out;   缩小镜
 cursor:all-scroll;  上下左右任何方向滚动
 cursor:crosshair;  十字准心
 cursor:pointer;  手
 cursor:wait;  等待
 cursor:help;  帮助
 cursor:no-drop;  无法释放
 cursor:text;  文字/编辑
 cursor:move;  可移动对象
 cursor:vertical-text;  可编辑的垂直文本的光标
 cursor:n-resize;  向上改变大小(North)
 cursor:s-resize;  向下改变大小(South)
 cursor:e-resize;  向右改变大小(East)
 cursor:w-resize;  向左改变大小(West)
 cursor:ne-resize;  向上右改变大小(North East)
 cursor:nw-resize;  向上左改变大小(North West)
 cursor:se-resize;  向下右改变大小(South East)
 cursor:sw-resize;  向下左改变大小(South West)
 cursor:col-resize;  可被水平改变尺寸
 cursor:row-resize;  可被垂直改变尺寸
 cursor:not-allowed;  禁止
 cursor:progress;  处理中
 cursor:default;  系统默认

 cursor:url('#');#为光标文件地址

 (注意文件格式必须为:.cur或.ani)

 用户自定义(可用动画)

 注意:在定义完自定义的游标之后在末尾加上一般性的游标,

 以防那些url所定义的游标不能使用

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

说明:

  cursor 属性:设置显示的光标的类型(形状)。

  此属性的值可以是多个,其间要用逗号分隔;

  假如第一个值无法找到而不能被显示,则第二个值将被尝试使用,依此类推;

  假如全部值都不可用的话,则此属性不会发生作用,光标也不会被改变。

  比如:{cursor:pointer,wait,help;},从pointer到wait,再到help,如果都没被应用,则cursor属性不起任何作用。

 

现在举一个“手”光标的例子,写法有两种:

效果图:

cursor:pointer;

 

第一种是行内样式:(行内样式:将CSS样式编写在标签之中)

cursor:pointer;

 第二种是内部样式:(内部样式:由<style>标签定位在<head>之中)

cursor:pointer;

 

转载于:https://www.cnblogs.com/mossbaoo/p/5743737.html

你可能感兴趣的文章
Linux下各规格的磁盘操作
查看>>
我的友情链接
查看>>
园区网DHCP+OSPF实现【神州数码设备】
查看>>
wget 用法
查看>>
彻底理解js中this的指向,不必硬背。
查看>>
Java 项目常用变量命名
查看>>
python开发sparkSQL应用
查看>>
拍照怎么搜题?(上)
查看>>
json字符串转java对象
查看>>
第十一章 命令传参过滤器、命令组合工具:xargs命令
查看>>
如何开启Apache Rewrite功能
查看>>
下载基于REST、SPDY、异步IO深入规模化网络、信息安全、通信优化企业应用系统...
查看>>
Centos7 更改docker镜像源
查看>>
login_required -- 登录验证
查看>>
linux基础篇-20,seq命令的用法
查看>>
shell学习笔记 (5)
查看>>
PowerDesigner生成数据库建表sql脚本
查看>>
数据库设计之拆分与数据类型选择
查看>>
mount命令的使用
查看>>
Git学习--打标签
查看>>