HTML光标样式
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样式编写在标签之中）
<table border="1">
<tr class="pointer" style="cursor:pointer;">
<td>cursor:pointer;</td>
<td>手</td>
</tr>
</table>
第二种是内部样式：（内部样式：由<style>标签定位在<head>之中）
<!-- 这里是style里面的内容 -->
<style type="text/css">
.pointer:hover{
cursor:pointer;
}
</style> <!-- 这里是body里面的内容 -->
<body>
<table border="1">
<tr class="pointer">
<td>cursor:pointer;</td>
<td>手</td>
</tr>
</table>
</body>
HTML光标样式的更多相关文章
- 第七十六节，css颜色和透明度,盒子阴影和轮廓,光标样式
css颜色和透明度,盒子阴影和轮廓,光标样式 学习要点: 1.颜色和透明度 2.盒子阴影和轮廓 3.光标样式 一．颜色和透明度 颜色我们之前其实已经用的很多了,比如字体颜色.背景颜色.边框颜色.但除了 ...
- 用图片替代cursor光标样式
鼠标光标样式有限,可参考http://css-cursor.techstream.org/,自定义光标样式可用设置cursor:url('xxx.cur'),auto;.还有一种办法,就是用图片替代鼠 ...
- 【css】cursor鼠标指针光标样式知识整理
在前端开发中,我们经常需要对对象鼠标指针光标进行控制,比如鼠标经过超链接时变成手指形状.在这里整理一下cursor鼠标指针光标样式的知识,记录与方便以后查找. 1.常用cursor光标 div( cu ...
- NotePad++中如何改变光标样式（转换横着和竖着）？
在键盘上找 Insert ,按这个Insert就可以把横向闪烁光标( _ )修改成竖向闪烁光标样式( | )
- CSS使用自定义光标样式-遁地龙卷风
测试环境是chrome浏览器 Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357. ...
- 鼠标指针光标样式css cursor default pointer hand url
一.cursor语法与结构 1.cursor语法:cursor : auto | crosshair | default | hand | move | help | wait | text | w- ...
- CSS表单3 光标样式 (每个位置鼠标放上去的样式不同)
<!DOCTYPE html> <html> <head> <title>单选按钮对齐</title> ...
- 设置Sublime Text 3的光标样式
升级了Sublime Text 3,结果光标变成了这个样子,非常不习惯: 查了文档http://www.sublimetext.com/3 ,Build 3059中得描述: Added setting ...
- 对span设置鼠标光标样式
<html> <body> <p>请把鼠标移动到单词上,可以看到鼠标指针发生变化:</p> <span style="cursor:au ...
随机推荐
- MVC Core 网站开发（Ninesky） 2.1、栏目的前台显示（补充）
在2.1.栏目的前台显示中因右键没有添加视图把微软给鄙视了一下,后来有仔细研究了一下发现应该鄙视自己,其实这个功能是有的,是自己没搞清楚乱吐糟. 其实只要在NuGet中安装两个包(Microsoft. ...
- PHP中PDO事务的使用方法
事务 (Transaction) 是操作数据库中很重要的一个功能, 它可以让你预定一条, 或者一系列 SQL 语句, 然后一起执行. 在执行的过程中, 如果其中的某条执行失败, 可以回滚所有已更改的操 ...
- 在centos7中添加一个新用户，并授权
前言 笔记本装了一个centos,想要让别人也可以登录访问,用自己的账号确实不太好,于是准备新建一个用户给他. 创建新用户 创建一个用户名为:zhangbiao [root@localhost ~]# ...
- Autofac - MVC/WebApi中的应用
Autofac前面写了那么多篇, 其实就是为了今天这一篇, Autofac在MVC和WebApi中的应用. 一.目录结构 先看一下我的目录结构吧, 搭了个非常简单的架构, IOC(web), IBLL ...
- from表单提交数据之后，后台对象接受不到值
如果SSH框架下,前段页面通过from表单提交数据之后,在后台对象显示空值,也就是接收不到值得情况下.首先保证前段输入框有值,这个可以在提交的时候用jQuery的id或者name选择器alert弹出测 ...
- linux-图形化远程管理协议
远程管理控制方式: RDP(remote desktop protocol)协议: telnet: SSH(Secure Shell): RFB(Remote FrameBuffer)协议(图形化远程 ...
- 用apt-file解决找不到头文件的问题
在编译C语言的开源项目的时候,经常会出现头文件找不到的问题. 解决这类问题有一个特别好用的工具apt-file 1.在ubuntu下安装 sudo apt install apt-file 2.更新索 ...
- Ubuntu(Linux) + mono + xsp4 + nginx +asp.net MVC3 部署
折腾了一下,尝试用Linux,部署mvc3. 分别用过 centos 和 ubuntu ,用ubuntu是比较容易部署的. 操作步骤如下: 一.终端分别如下操作 sudo su ->输入密码 a ...
- DIP原则、IoC以及DI
一.DIP原则 高层模块不应该依赖于底层模块,二者都应该依赖于抽象. 抽象不应该依赖于细节,细节应该依赖于抽象. 该原则理解起来稍微有点抽象,我们可以将该原则通俗的理解为:"依赖于抽象&qu ...
- WinRT自定义控件第一 - 转盘按钮控件
之前的文章中,介绍了用WPF做一个转盘按钮控件,后来需要把这个控件移植到WinRT时,遇到了很大的问题,主要原因在于WPF和WinRT还是有很大不同的.这篇文章介绍了这个移植过程,由于2次实现的控件功 ...