CSS自定义鼠标指针样式「建议收藏」

CSS自定义鼠标指针样式「建议收藏」还记得Web1.0时代的那些苦逼岁月吗?你想尽一切办法来优化你的网站.还要饱受IE6惨无人道的虐待,举个栗子,IE中那些害死人不偿命的滚动条,我一直记得第三方类库CometCursor.CometCursor非常强悍,主要用来创建和加载自定义鼠标光标样式。现在可能你会觉得当初的那些实现手段特别老土,但有时又确实需要定制一下光标图案,那么一起来看看CSS怎么实现吧,It’sSoEasy,哪里不会点哪里!

大家好,又见面了,我是你们的朋友全栈君。原文链接:
http://davidwalsh.name/css-custom-cursor

Demo地址:
http://davidwalsh.name/demo/css-custom-cursor.php

原文日期: 2014-09-16

翻译日期: 2014-09-17

翻译人员:
铁锚

还记得Web 1.0时代的那些苦逼岁月吗? 你想尽一切办法来优化你的网站. 还要饱受IE6惨无人道的虐待,举个栗子, IE中那些害死人不偿命的滚动条, 我一直记得第三方类库 CometCursor. CometCursor非常强悍,主要用来创建和加载自定义鼠标光标样式。现在可能你会觉得当初的那些实现手段特别老土,但有时又确实需要定制一下光标图案,那么一起来看看CSS怎么实现吧, It’s So Easy, 哪里不会点哪里!

CSS代码

CSS中的 cursor 属性可以用逗号分隔指定一系列的光标项,可以用 url() 来自定义光标的图案:

body {
	cursor: url('some-cursor.ico'), default;
}

在实际应用中, 最好在后面加上后备的原生光标,如
default, 这和设置字体(
font-family)样式是一样的道理。

有一点需要注意,Firefox会将光标裁剪到一个较小的比例, 而Chrome现在支持更大的图标尺寸。

不要犹豫了,在重要的地方加上自定义指针图标吧. 就如在看相册预览时的放大(+)和缩小(-)按钮,你肯定想做得与众不同.

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/144069.html原文链接:https://javaforall.net

(0)
上一篇 2022年5月20日 上午9:40
下一篇 2022年5月20日 上午10:00


相关推荐

  • 工作量证明(PoW)的内部攻击模型「建议收藏」

    工作量证明(PoW)的内部攻击模型「建议收藏」虽然,POW算法其实并没有协调选择博弈论中的安全性,因为多数联盟可以形成和有益的审查和回复块。但是当我们考虑PoW的攻击时,通常不会考虑到矿工联合攻击,而是想到购买矿工设备或者对更重链进行挖矿。这篇文章主要是谈论PoW对抗控制半数哈希力攻击的能力,不允许租用,或贿赂矿工,或与矿工进行任何其他形式的合作。外部攻击外部攻击者购买足够的GPU或者ASIC直到完成对可信网络的“51%攻击”,或者至少…

    2022年5月28日
    42
  • Android应用程序开发习题答案

    Android应用程序开发习题答案第一章 Android 简介 1 简述各种手机操作系统的特点 目前 手机上的操作系统主要包括以下几种 分别是 Android iOS WindowsMobil WindowsPhone Symbian 黑莓 PalmOS 和 Linux 1 Android 是谷歌发布的基于 Linux 的开源手机平台 该平台由操作系统 中间件 用户界面和应用软件组成 是第一个可以完全定制 免费 开放的手机平台 Android 底层使用开源的 Linux 操作系统 同时开放了应用程序开发工具 使所有程序开发人员都在统一 开放

    2026年3月26日
    2
  • 即梦AI萌娃生成教程

    即梦AI萌娃生成教程

    2026年3月12日
    2
  • 另外一个进程已经为dpkg frontend 加锁_oracle数据库重启步骤

    另外一个进程已经为dpkg frontend 加锁_oracle数据库重启步骤一、问题描述  平时喜欢边听歌边敲代码(有种拯救世界的感觉),windows时一直用网易云,换了linux非常不方便,所以想给我的ubuntu(16.04)装一个。去官网找了一下,还真有linux版的,还特别标明是ubuntu16.04(64位),良心软件啊,接下来就是载下来按部就班安装了。  载下来是.deb格式的,需要用以下命令:dpkg-i<软件名.deb>…

    2022年10月6日
    3
  • ipconfig /flushdns的使用

    ipconfig /flushdns的使用ipconfig nbsp flushdns nbsp 刷新 dns 缓存的命令 nbsp nbsp nbsp nbsp nbsp 当访问一个网站时系统将从 DNS 缓存中读取该域名所对应的 IP 地址 当查找不到时就会到系统中查找 hosts 文件 如果还没有那么才会向 DNS 服务器请求一个 DNS 查询 DNS 服务器将返回该域名所对应的 IP 在你的系统收到解析地址以后将使用该 IP 地址进行访问 同时将解析缓存到本地的 DNS 缓存中 nbsp nbsp nbsp nbsp 如果 DNS 地址无

    2026年3月17日
    2
  • 查看 Python 版本

    查看 Python 版本文章目录 1 概述 2 查看方式 2 1Window 命令行 2 2Python 交互模式 2 3Pycharm 中 1 概述 mermaid svg PRifc1boaO7G label font family trebuchetms verdana arial font family var mermaid font family fill 333 color 333 mermaid svg PRifc1boaO7G labeltext fill 333 m

    2026年3月20日
    2

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号