200字范文,内容丰富有趣,生活中的好帮手!
200字范文 > html中的鼠标样式 css 如何为html页面设置鼠标样式呢?

html中的鼠标样式 css 如何为html页面设置鼠标样式呢?

时间:2024-02-15 17:00:21

相关推荐

html中的鼠标样式 css 如何为html页面设置鼠标样式呢?

摘要:

下文讲述css为html页面设置鼠标样式的方法分享,如下所示:

在html页面中,我们经常看见各种各样的鼠标样式,如:等待形、手指形 那么这些形状是如何使用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图片地址) } //设置对象为图片

例:

为div设置鼠标样式为移动形状

猫猫教程()

---为div设置cursor设置移动形状

div{

height:130px;

line-height:130px;

width:260px;

cursor:move;

background-color:green;

color:white;

}

当鼠标 放在Div中时,鼠标显示为移动形状

鼠标变为 移动形状

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。