css设置鼠标形状,css鼠标效果

  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来源)

css设置鼠标形状,css鼠标效果