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 ...
随机推荐
- SQL Server内存遭遇操作系统进程压榨案例
场景: 最近一台DB服务器偶尔出现CPU报警,我的邮件报警阈(请读yù)值设置的是15%,开始时没当回事,以为是有什么统计类的查询,后来越来越频繁. 探索: 我决定来查一下,究竟是什么在作怪,我排查的 ...
- 如何创建Vim Dotfile？
Dotfile是电脑系统里的隐藏文件,它是专门给更高级的用户,如开发者.程序员或工程师使用的,让他们用来调整系统.如何创建Vim-Dotfile? 可以参考以下步骤: 1. 首先,你要检查一下.vim ...
- 120项改进：开源超级爬虫Hawk 2.0 重磅发布！
沙漠君在历时半年,修改无数bug,更新一票新功能后,在今天隆重推出最新改进的超级爬虫Hawk 2.0! 啥?你不知道Hawk干吗用的? 这是采集数据的挖掘机,网络猎杀的重狙!半年多以前,沙漠君写了一篇 ...
- spring源码分析之@ImportSelector、@Import、ImportResource工作原理分析
1. @importSelector定义: /** * Interface to be implemented by types that determine which @{@link Config ...
- 代码的坏味道（19）——狎昵关系(Inappropriate Intimacy)
坏味道--狎昵关系(Inappropriate Intimacy) 特征 一个类大量使用另一个类的内部字段和方法. 问题原因 类和类之间应该尽量少的感知彼此(减少耦合).这样的类更容易维护和复用. 解 ...
- HTTP API接口安全设计
HTTP API接口安全设计 API接口调用方式 HTTP + 请求签名机制 HTTP + 参数签名机制 HTTPS + 访问令牌机制 有没有更好的方案? OAuth授权机制 OAuth2.0服务 ...
- Struts2入门(五)——OGNL和标签库
一.前言 OGNL和标签库的作用,粗暴一点说,就是减少在JSP页面中出现java代码,利于维护. 1.1.OGNL 1.1.1.什么是OGNL? OGNL(Object-Graph Navigatio ...
- docker – 你应该知道的10件事
容器并不是一个全新的技术,但这并不妨碍Docker如风暴一样席卷整个世界. 如果你在IT圈里,你一定听说过Docker.就算与其他热门技术,如:Puppet/Chef,Hadoop或者MongoD ...
- ASP.NET MVC 5 系列 学习笔记 目录 (持续更新...)
前言: 记得当初培训的时候,学习的还是ASP.NET,现在回想一下,图片水印.统计人数.过滤器....HttpHandler是多么的经典! 不过后来接触到了MVC,便立马爱上了它.Model-View ...
- 微软开放.NET框架源代码和Mono
微软一直在朝着更加开放的方向努力.例如,公司首席执行官萨特亚纳德拉(Satya Nadella)在Windows 10预览发布会上声称微软喜欢Linux,这并不出人意料,但是对于一家将Linux视作威 ...