CSS 鼠标样式和手指样式

巧合要用到鼠标样式效果,就顺便整理了下十五种CSS鼠标样式,小例子供大家使用啊。CSS鼠标样式语法如下:

任意标签中插入 style="cursor:*"  

例 子:<span style="cursor:*">文本或其它页面元素</span>  <a href="#" style="cursor:*">文本或其它页面元素</a>  注意把 * 换成如下15个效果的一种:

下面是对这15种效果的解释。移动鼠标到解释上面,看看你的鼠标起了什么变化吧!

hand是手型    

例子:CSS鼠标手型效果  <a href="#" style="cursor:hand">CSS鼠标手型效果</a>

pointer也是手型,这里推荐使用这种,因为这可以在多种浏览器下使用。 

例子:CSS鼠标手型效果 <a href="#" style="cursor:pointer">CSS鼠标手型效果</a>

crosshair是十字型 

例子:CSS鼠标十字型 效果 <a href="#" style="cursor:crosshair">CSS鼠标十字型 效果</a>

help是问号

例子:CSS鼠标问号效果 <a href="#" style="cursor:help">CSS鼠标问号效果</a>

下面写法都一样,这里就不一一写完了。

text是移动到文本上的那种效果 

wait是等待的那种效果 

default是默认效果 

e-resize是向右的箭头

ne-resize是向右上的箭头

n-resize是向上的箭头

nw-resize是向左上的箭头

w-resize是向左的箭头

sw-resize是左下的箭头

s-resize是向下的箭头

se-resize是向右下的箭头

auto是由系统自动给出效果

时间: 2024-08-01 17:55:17

CSS 鼠标样式和手指样式的相关文章

jQuery实现鼠标划过修改样式的方法

 本文实例讲述了jQuery实现鼠标划过修改样式的方法.分享给大家供大家参考.具体如下: 1 2 3 4 5 6 7 8 9 10 11 12 $(document).ready(function () { //默认情况下样式 $("input:text").attr("style","border:1px solid #7E9DB9;"); //鼠标移入样式 $("input:text").mouseover(functio

JavaScript获取css行间样式,内连样式和外链样式的简单方法_javascript技巧

[行间样式获取] <div id='div1' style="backgroud:red">测试</div> <script> var odiv=document.getElementById('div1'); //先获取到要获取样式的元素标签,也就是获取到div1 console.log(odiv.style.background); //这样我们就可以获取到了行间的样式了 </script> [内连样式获取] <html>

javascript在css样式中获取样式

问题描述 javascript在css样式中获取样式 <link href="beijingyangse.css" rel="stylesheet" type="text/css" /> </head> <script type="text/javascript"> /*本函数的功能是判断浏览器的内核*/ function chank(enval) { var enval = enval.v

如何使用jquery修改css中带有!important的样式属性_jquery

<div class="test">使用jquery修改css中带有!important的样式属性</div> 外部样式为: div.test{ width:auto !important; overflow:auto !important } 通过 $("div.test").css("width","100px");和 $("div.test").css("width&

获取css样式表内样式的js函数currentStyle(IE),defaultView(FF)_javascript技巧

可是DOM.style这种写法只能访问<DOM style=""></DOM>,这样在标签里内置的样式,如果样式写在<style type="text/css"></style>,或者.css文件里,那么就办法读到样式了. 其实呢,还有别的方法可以读到这些样式信息,方法有两种,一种是通过document.styleSheets对象,另一种是通过"最终样式"对象.其中 IE中这个对象叫做current

jQuery实现鼠标划过修改样式的方法_jquery

本文实例讲述了jQuery实现鼠标划过修改样式的方法.分享给大家供大家参考.具体如下: $(document).ready(function () { //默认情况下样式 $("input:text").attr("style","border:1px solid #7E9DB9;"); //鼠标移入样式 $("input:text").mouseover(function () { $(this).attr("st

ASP。NET 中 在CSS文件中定义的样式背景为啥显示不出来

问题描述 ASP.NET中在CSS文件中定义的样式背景为啥显示不出来 解决方案 解决方案二:没代码怎么知道~解决方案三:给出代码.可能路径问题,或者是选择器错误.解决方案四:比较大可能是路径问题解决方案五:引用CSS文件的代码贴出来.解决方案六:可以把CSS文件放到<head></head>之间,还有你说那个问题,可以能是路径引用不对解决方案七:直接写在里面试试例如<divstyle="color:red"></div>解决方案八:应该是

[译] JavaScript 中的 CSS:基于组件的样式的未来

本文讲的是[译] JavaScript 中的 CSS:基于组件的样式的未来, 原文地址:CSS in JavaScript: The future of component-based styling 原文作者:Jonathan Z. White 译文出自:掘金翻译计划 译者:bambooom 校对者:Aladdin-ADD.reid3290 JavaScript 中的 CSS:基于组件的样式的未来 使用行内样式使我们可以获得 JavaScript 的所有编程支持.这让我们获得类似 CSS 预处

CSS鼠标响应事件经过、移动、点击示例介绍_javascript技巧

几种鼠标触发CSS事件. 说明: onMouseDown 按下鼠标时触发 onMouseOver 鼠标经过时触发 onMouseUp 按下鼠标松开鼠标时触发 onMouseOut 鼠标移出时触发 onMouseMove 鼠标移动时触 复制代码 代码如下: <html> <head> <title>CSS 鼠标响应事件</title> <meta http-equiv="Content-Type" content="text