2

我遇到了一些 CSS 问题。我正在尝试为悬停在链接上时设置自定义光标。我正在尝试使用此代码，但没有任何反应，它仍然是指针。

a {
    color: #99ccff;
    cursor: paw.cur;
}

a:hover {
    color: #71b2f4;
    cursor: paw.cur;
}

即使添加!important到 a:hover 的末尾也不起作用。

4

2 回答 2

5

使用：cursor: paw.cur;是不正确的 CSS 语法。

如果要使用基于自定义图像的光标，则必须指定 URL。

在此处查看 cursor..文档的规格（mozilla 开发人员）。

这是自定义光标的示例..

a:hover {
    cursor:url(http://www.javascriptkit.com/dhtmltutors/cursor-hand.gif), auto;
}

jsfiddle 这里 - 自定义

这是默认光标的示例..

a:hover {
    cursor: crosshair;
}

jsfiddle 这里 - 默认

其实前段时间我回答了一个类似的问题： Using external images for CSS custom cursors

于 2013-09-22T01:39:13.320 回答
1

你需要像这样使用它：

cursor: url('paw.cur');

或者

cursor: url('paw.gif');

如果要使用自定义光标，则需要使用 URL。

引用 MDN

正式语法： [ [[ ]?,]* [ 自动 | 默认 | 没有 | 上下文菜单 | 帮助 | 指针 | 进展 | 等待 | 细胞 | 十字准线 | 正文 | 垂直文本 | 别名 | 复制 | 搬家 | 不掉线 | 不允许| 电子调整大小 | n-调整大小 | 调整大小 | nw 调整大小 | 调整大小 | 调整大小 | sw-调整大小 | w-调整大小 | ew-调整大小 | 调整大小 | 新调整大小 | nwse 调整大小 | col-调整大小 | 行调整大小 | 全卷 | 放大 | 缩小 ] ]

<uri>
url(…) 或逗号分隔列表 url(…)、url(…)、…，指向图像文件。如果不支持某些光标图像类型，则可以提供多个作为后备。非 URL 后备（一个或多个其他值）必须位于后备列表的末尾。有关更多详细信息，请参阅使用游标属性的 URL 值。

和

即使将 !important 添加到 a:hover 的末尾也不起作用。

相信我!important并不是在每一个地方都做魔法，它只是设置最高优先级

有用的帖子

于 2013-09-22T01:40:25.690 回答