光标样式

<style>  div{      display:inline-block;      border:1px solid black;      width:60px;      height:50px;  }</style>//////////////
<div style="cursor:all-scroll">十字箭头</div><div style="cursor:crosshair">水平拖动线</div><div style="cursor:move">移动十字箭头</div><div style="cursor:help">带问号箭头</div><div style="cursor:no-drop">禁止</div><div style="cursor:not-allowed">禁止</div><div style="cursor:pointer">手型</div><div style="cursor:progress">带沙漏箭头</div><div style="cursor:row-resize">垂直拖动线</div><div style="cursor:text">文本编辑</div><div style="cursor:vertical-text">垂直文本编辑</div><div style="cursor:wait">沙漏</div><div style="cursor:n-resize">可向上拖动光标</div><div style="cursor:ne-resize">上右可拖动光标</div><div style="cursor:se-resize">下右可拖动光标</div>
 
时间: 2024-10-17 21:04:20

光标样式的相关文章

css cursor鼠标指针光标样式default pointer hand url

我们在DIV CSS布局时候,我们会遇到对对象内鼠标指针光标进行控制,比如鼠标经过指针变为手指形状等样式,接下来我们介绍鼠标指针样式cursor控制.系统默认鼠标指针样式外,可以通过CSS设置图片为鼠标指针,常见有些网站鼠标指针是各种各样小图片样式,当然这个是通过css cursor设置鼠标样式. 详见网站介绍:http://www.divcss5.com/rumen/r427.shtml css cursor鼠标指针光标样式default pointer hand url,布布扣,bubuko

JQueryUI-拖动(Draggable)-光标样式

定义和用法 当拖拽对象时定位光标.默认情况下,光标是出现在被拖拽对象的中间.使用 cursorAt 选项来指定相对于 draggable 的另一个 位置(指定一个相对于 top.right.bottom.left 的像素值).通过提供一个带有有效的 CSS 光标值的 cursor 选项,来自 定义光标的外观 示例 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta h

用图片替代cursor光标样式

鼠标光标样式有限,可参考http://css-cursor.techstream.org/,自定义光标样式可用设置cursor:url('xxx.cur',auto;),可是老是不生效,不知什么原因.那怎么办呢?还有一种办法,就是用图片替代鼠标光标,下面就介绍如何使用之. 1.制作光标图片(ps等工具),注意不要用白底,用透明底,透明底一般为gif或者png格式图片. 图1 我做的箭头图片32*32px 2.用一个span标签包含图片 <span id="cursorLRArrow&quo

HTML光标样式

HTML光标样式 把你的光标放到相应文字上鼠标显示效果   cursor:auto;   自动  cursor:all-scroll;  上下左右任何方向滚动  cursor:crosshair;  十字准心  cursor:pointer;  手  cursor:wait;  等待  cursor:help;  帮助  cursor:no-drop;  无法释放  cursor:text;  文字/编辑  cursor:move;  可移动对象  cursor:vertical-text;  

【css】cursor鼠标指针光标样式知识整理

在前端开发中,我们经常需要对对象鼠标指针光标进行控制,比如鼠标经过超链接时变成手指形状.在这里整理一下cursor鼠标指针光标样式的知识,记录与方便以后查找. 1.常用cursor光标 1 div( cursor:default;} //默认正常鼠标指针 2 div( hand;}和div( cursor:text;} //文本选择效果 3 div( cursor:move;} //移动选择效果 4 div( cursor:pointer;} //手指形状 5 div( cursor:url("

CSS中cursor 鼠标指针光标样式(形状)

在前端开发中,我们经常需要对对象鼠标指针光标进行控制,比如鼠标经过超链接时变成手指形状.在这里整理一下cursor鼠标指针光标样式的知识,记录与方便以后查找. 常用cursor光标 url 需使用的自定义光标的 URL. 注释:请在此列表的末端始终定义一种普通的光标,以防没有由 URL 定义的可用光标. default 默认光标(通常是一个箭头)auto 默认.浏览器设置的光标.crosshair 光标呈现为十字线.pointer 光标呈现为指示链接的指针(一只手)move 此光标指示某对象可被

CSS使用自定义光标样式-遁地龙卷风

测试环境是chrome浏览器 Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.132 Safari/537.36 css样式 div { cursor:url('1.jpg'),pointer; } HTML <body> <div style="width:100px;height:100px;background-color:red;">

Android EditText 光标样式设置

android不同手机对于edittext光标显示样式不一,所以如果设置不同手机显示一样的效果呢,统一设置一个样式就可以了,示例代码如下: <EditText android:layout_width="fill_parent" android:layout_height="wrap_content" android:textCursorDrawable="@drawable/color_cursor"/> 样式文件: <?xm

用Css定义不同的鼠标光标样式

系统光标大家再熟悉不过了,熟悉的甚至忘了它们的存在.用CSS我们可以将这些光标一一展现出来,本例将展现给大家用CSS实现拖动符的光标.链接小手.移动光标.带问号的光标.不可操作的光标.小手光标.带运行符的光标.上下拖动的光标.普通打字光标.竖向排行的文字光标.系统忙的光标等. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xh

html鼠标光标样式

1 <span style="cursor:pointer">手形</span> 2 <span style="cursor:crosshair">十字</span> 3 <span style="cursor:text" >文本光标</span> 4 <span style="cursor:wait" >等待</span> 5 &