时间戳

首页 > 解决方案 > 如何使用 CSS 更改网站的光标？

html - 如何使用 CSS 更改网站的光标？

问题描述

我想更改我网站的所有鼠标光标。我试着做；

body {
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/Arrow.cur"), default;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/AppStarting.ani"), progress;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/Help.cur"), help;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/Wait.ani"), wait;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/Cross.cur"), crosshair;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/Hand.ani"), pointer;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/IBeam.cur"), text;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/SizeAll.cur"), move;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/NO.ani"), not-allowed;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/SizeAll.cur"), all-scroll;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/SizeNS.cur"), row-resize;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/SizeWE.cur"), col-resize;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/SizeWE.cur"), ew-resize;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/SizeNS.cur"), ns-resize;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/SizeNESW.cur"), nesw-resize;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/SizeNWSE.cur"), nwse-resize;
cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/NO.ani"), no-drop;
}

但它没有用。

有什么帮助吗？

标签： htmlcss

解决方案

您只能定义一个游标属性（与任何属性一样），因此您只能拥有一个游标。,用于备用值，但不用于定义您使用的图像的用途。

写这个：

cursor: url("http://rsc-wiki.wikidot.com/local--files/temalar:rsc/NO.ani"), no-drop

并不意味着，no-drop光标将使用您指定的图像。这意味着如果 URL 不存在或者不是有效的游标文件，则使用no-drop游标。此属性是最后一个属性，因此它会覆盖所有以前的属性。

在此处输入图像描述

游标属性被指定为零个或多个<url>值，以逗号分隔，后跟一个强制关键字值。每个都<url>应该指向一个图像文件。浏览器将尝试加载指定的第一个图像，如果不能加载则回退到下一个，如果无法加载图像（或者没有指定），则回退到关键字值。参考

您想要做的是使用 CSS 是不可能的，因为默认光标是浏览器设置和操作系统的一部分。充其量您可以为自己的浏览器更改它们，但您不能为其他浏览器更改它们。您可以简单地根据元素、事件等定义自定义光标

推荐阅读