深圳市金黑网络技术有限公司始终坚持以用户需求为导向,提供安全、稳定、高效的产品和服务!
签到 · 搜索导航 · 服务热线 · 微信/手机:17817817816

深圳网站建设

查看: 1092|回复: 0

鼠标样式光标形状css

[复制链接]

UID
13
贡献
74
金币
0
主题
24
在线时间
10 小时
注册时间
2023-6-26
最后登录
2023-7-5
发表于 2023-6-26 22:06:09 | 1092 | 0 | 显示全部楼层 |阅读模式
鼠标样式光标形状css

光标形状
语法:cursor:值
取值:
        text:文本图标  
        help:问号图标
        wait:等待的图标
        pointer:        小手图标
        move 移动
        url(),临时替换的样式-----需要在url后面加auto
        default  箭头
代码如下:
  1. <head>
  2.         <meta charset="utf-8" />
  3.         <title></title>
  4.         <style type="text/css">
  5.                 div{
  6.                         width:100px;
  7.                         height:50px;
  8.                         border:1px solid #000;
  9.                 }
  10.                 .box1{
  11.                         cursor:text;
  12.                 }
  13.                 .box2{
  14.                         cursor:help;
  15.                 }
  16.                 .box3{
  17.                         cursor:wait;
  18.                 }
  19.                 .box4{
  20.                         cursor:pointer;
  21.                 }
  22.                 .box5{
  23.                         cursor:move;
  24.                 }
  25.                 .box6{
  26.                         cursor:url('bitbug_favicon.ico'),auto;
  27.                 }
  28.                 .box7{
  29.                         cursor:default;
  30.                 }
  31.         </style>
  32. </head>
  33. <body>
  34.         <div class="box1">文本</div>
  35.         <div class="box2">问号</div>
  36.         <div class="box3">等待</div>
  37.         <div class="box4">小手</div>
  38.         <div class="box5">移动</div>
  39.         <div class="box6">图片</div>
  40.         <div class="box7">箭头</div>
  41. </body>
复制代码


楼主热帖

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

快速回复 返回顶部 返回列表