css设置鼠标形状,css鼠标效果
在Web发展的早期,随着新技术的不断涌现,一切都令人兴奋。但是在过去的十年里,我们经历了一次技术停滞,直到HTML5的出现让Web开发再次引人入胜。尤其是CSS3发展很快,你会在它的规范中发现很多有趣的宝藏。
在本文中,我们将研究CSS鼠标样式属性,正如你所期望的,它允许你在移动鼠标到一个元素上时改变指针的样式。交互式Web应用变得越来越重要。
CSS2的鼠标样式
CSS2中的可用选项相对较少(将鼠标悬停在不同的web页面元素上,查看鼠标指针样式如何变化):
CSS3的鼠标样式
我们在CSS3中有更多的风格可供选择。他们可以在IE9和最新版本的Firefox、Chrome、Safari、Opera上工作(除非另有说明):
浏览器专用指针
Mozilla Chrome和Safari的某些版本中提供了一些私有样式,这些样式可能会成为CSS3规范的一部分:
创建您自己的指针。
最后,您可以创建自己的指针图形,例如:
注意:
1.Internet Explorer需要Windows指针文件(。cur)。
2.Firefox、Chrome和Safari需要一个图像——我推荐使用24位Alpha透明PNG图像。
3.Firefox还需要一个非URL指针设置作为替代值。
4.Opera不支持这种写法。
5.x和Y是Firefox、Chrome和Safari中的可选属性,它们定义了图像从左上角开始的精确指针位置。如果省略,默认值为0。
好吧,但是看起来会耗费我太多的精力!所以我会一直坚持标准的指针风格。
出发地:http://www.sitepoint.com/css3-cursor-styles/
作者克雷格巴克勒,2011年1月5日
译者:姜玉洁(请注明http://blog..net/hfahe来源)