电脑技术网——专业手机电脑知识平台,关注科技、手机、电脑、智能硬件
HTMLCSSHTML5Bootstrap

css的cursor属性怎么设置

2020-11-28 15:18:10 出处:[ 菜菜电脑网 ] 人气:次阅读
很多朋友不是很可信css的cursor属性怎么设置,今天我们来给大家引介一下cursor属性,以及他的语法和一个小列子,设法大家交往cursor属性。

我们在DIV CSS布局时候,我们但会察觉到对对象内鼠标指针光标展开压制,比如鼠标经过指针去掉手指形状等样式,接下来我们概述鼠标指针样式cursor操控。系统当前鼠标指针样式外,可以通过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)

常用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设置或检索在对象上移动的鼠标指针有别于何种系统按计划义的光标形状。

布局结构

p { cursor: text; } /* css译文: 设置鼠标移动到html p对象时鼠标去掉文本为了让样式 */

a { cursor: pointer; } /* css注解: 设置鼠标移动到a超链接对象时鼠标转为手指形状(链接可选择) */

body { cursor: url("小图片地址")} /* 设置鼠标指针配置文件为一个小图片 */

扩充朗读:css a、css a link、a hover、css超链接样式

鼠标指针样式总结

鼠标指针样式操控设置是比较常用的,比如日常我们在DIV+CSS布局时候,我们想要鼠标指向某个局部span标签对象时候,鼠标指针光标就转换成手指状态,这个时候我们就对对象span设置cursor: pointer即可。以上我们图例简介常用的鼠标光标形状与css单词,渴望布局时候更加自身需选项设置鼠标指针样式。所需提醒是,光标切记勿犯罪行为,也不要短时间设置自定义图片为鼠标样式这样则会将网页遭受十分复杂与不具备用户体验感觉,切记光标。

深信经过我们的详述,大家对于cursor属性也有了更深层次的洞察。更多精彩再三注意php中文网其它涉及文章!

无关选读:

div浮动层与预设的div层有什么关系

怎么并不知道DIV设置什么CSS属性样式?

怎样想到浏览器支不支持者html5

以上就是css的cursor属性怎么设置的参考内容,更多恳请注目php中文网其它具体文章!

关于我们 - 广告合作 - 联系我们 - 免责声明 - 网站地图 - 投诉建议 - 在线投稿

©CopyRight 2008-2020 caicaipc.com Inc All Rights Reserved.
菜菜电脑网 版权所有 联系QQ:173533152