css怎么改鼠标样式,如何利用CSS改变鼠标的样式

css怎么改鼠标样式,如何利用CSS改变鼠标的样式各种各样的鼠标样式,对于经常使用电脑的人而言一定不会生疏。当鼠标移动到不同的地方时,当鼠标执行不同的功能时,鼠标的外形都会发生变化。但在网页上,貌似只有当鼠标在超级链接上时才出现一个手形,在其它地方似乎没有什么变化,同布满动感的网页显得不怎么和谐。实际上,用css可以方便地定义许多种鼠标外形。下面小编就为大家介绍一下怎样利用CSS改变鼠标的样式。用CSS改变鼠标的样式,我们使用cursor属性,现…

大家好,又见面了,我是你们的朋友全栈君。

各种各样的鼠标样式,对于经常使用电脑的人而言一定不会生疏。当鼠标移动到不同的地方时,当鼠标执行不同的功能时,鼠标的外形都会发生变化。但在网页上,貌似只有当鼠标在超级链接上时才出现一个手形,在其它地方似乎没有什么变化,同布满动感的网页显得不怎么和谐。实际上,用css可以方便地定义许多种鼠标外形。下面小编就为大家介绍一下怎样利用CSS改变鼠标的样式。

用CSS改变鼠标的样式,我们使用cursor属性,现在就让我们了解一下这个属性的相关内容。

一、cursor语法

cursor属性的属性值分为

auto|crosshair|default|hand|move|help|wait|text|w-resize|s-resize|n-resize|e-resize|ne-resize|sw-resize|se-resize|nw-resize|pointer|url(url)

部分效果可见下图

9e8aff47e91a96c2a2907fddc779d6fc.png

而我们最常用的cursor光标有以下几种

1)div{cursor:default }默认正常鼠标指针

2)div{cursor:hand}和div{cursor:text}文本选择效果

3)div{cursor:move}移动选择效果

4)div{cursor:pointer}手指形状链接选择效果

5)div{ cursor:url(url图片地址)}设置对象为图

二、cursor的作用

cursor设置或检索在对象上移动的鼠标指针采用何种系统预定义的光标形状。

三、cursor写法

cursor写法非常简单

如果你想设置鼠标移动到html p对象时鼠标变为文本选择样式,只需这样写:

p{cursor:text;}

如果你想设置设置鼠标移动到a超链接对象时鼠标变为手指形状,可以写为:

a{cursor:pointer;}

当你需要设置鼠标指针默认为一个小图片时,则可以:

body {cursor:url;/*小图片地址*/}

了解了相关属性值的含义,鼠标的外形就在你的把握之中了,需要让鼠标在那里变为什么外形,只需改变该元素的cursor属性值即可。虽然小编为大家提供了很多cursor的属性值。但在实际布局时,应注意不要滥用光标并尽量减少使用自定义图片作为鼠标样式,从而避免网页给人一种过于复杂不符合用户体验的感觉。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/138345.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • 比特币挖矿培训来到印度30个城市[通俗易懂]

    比特币挖矿培训来到印度30个城市[通俗易懂]点击上方“蓝色字”可关注我们!暴走时评:为了促进印度达利特阶层的商业企业发展,2005年印度成立了行业协会DICCI。Mahabfic则是在马哈拉施特拉邦宣传区块链、金融科技、ICO和加密货币投资的平台。最近两个机构合作在印度30个城市展开比特币挖矿培训,包括区块链技术、挖矿、创业、初创企业等课程内容。旨在为这些地区年轻人自主就业提供帮助,为这些地区创造新的经济增长点。作者:KevinHelms

  • acwing-2983. 玩具(计算几何)

    acwing-2983. 玩具(计算几何)计算玩具收纳盒中,每个分区内的玩具数量。约翰的父母有一个烦恼—-约翰每次玩完玩具以后总会将玩具乱扔。他们为约翰准备了一个长方形的玩具收纳盒,用来放他的玩具。但是约翰非常调皮,每次都非常随意的将玩具扔进盒子中,使得所有玩具都随意混在一起,这让约翰难以找到他喜欢的玩具。对此,约翰的父母想出了一个对策,用若干个纸板将收纳盒分隔成若干个分区,这样至少扔到不同分区的玩具之间还是能分开的。下面是一个收纳盒的俯视图示例。1.jpg你的任务是,每当约翰将玩具扔进收纳盒中时,确定每个分区中有多少个玩具。输

  • 怎么重新启动协议服务器,ssl协议怎么开启

    怎么重新启动协议服务器,ssl协议怎么开启1.首先打开浏览器,找到工具→Internet选项2.找到高级选项卡,下面的使用SSL3.0勾选之后,点击保存即可。3.重新打开网站检查。对于chrome浏览器,SSL和TLS都协议是默认开启的,可以按下F12,然后在开发者工具中查看当前使用的协议版本。若是服务器配置ssl协议证书,首先确认Apache服务器已经安装有加密模块,可以是OpenSSL,或是OpenSSL+ModSSL。通过O…

  • 布隆过滤器 原理及优缺点分析_布隆过滤器误判怎么办

    布隆过滤器 原理及优缺点分析_布隆过滤器误判怎么办用于检索一个元素是否在集合中,其空间和时间上及其优秀!

  • 小说和漫画

    小说和漫画武侠金庸系列梁羽生系列古龙系列黄易系列卧龙生系列马荣成风云系列无忧公主萧逸奇侠杨小邪李凉神偷小千李凉天龙卷高庸剑魔独孤求败令狐庸金菊四绝曹若冰霸海心香东方英黄

  • PHP操作mysql数据库:[2]查询数据听语音

    PHP操作mysql数据库:[2]查询数据听语音

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号