测试环境是chrome浏览器

Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.132 Safari/537.36

css样式

div
{
  cursor:url('1.jpg'),pointer;
}

HTML

<body>
  <div style="width:100px;height:100px;background-color:red;"></div>

</body>

当鼠标放到div上,光标会变成你指定的图案

*注意事项

要确保自定义的图片足够小,这里的是16*16

不同浏览器支持的图片格式不一样,请自行查找

cursor:url('1.jpg'),pointer;这里的1.jpg要和当前html文件在同级目录,pointer是必要的,当自定义的图片不能应用时采用的备用方案,本次测试不写是不对的。

CSS使用自定义光标样式-遁地龙卷风的更多相关文章

  1. 「HTML+CSS」--自定义按钮样式【002】

    前言 Hello!小伙伴! 首先非常感谢您阅读海轰的文章,倘若文中有错误的地方,欢迎您指出- 哈哈 自我介绍一下 昵称:海轰 标签:程序猿一只|C++选手|学生 简介:因C语言结识编程,随后转入计算机 ...

  2. [HTML/CSS]uploadify自定义按钮样式

    概述 在项目中经常用到uploadify上传插件,但是FLASH按钮的外观往往跟我们网页的设计的主题色不太搭配.这时就需要对其样式进行修改. 样式文件是uploadify.css. 打开这个文件后,你 ...

  3. Android 自定义光标样式

    今天自定义光标,自己切图,不过怎么切都是很宽.不是一个很细的条.我用ps花了一个像素的直线,放上去还是不行.后来在网上找到方法,那就是用shape.不得不说,shape真的是太吊了. 给EditTex ...

  4. CSS伪选择器的使用-遁地龙卷风

    分为伪元素选择器和伪类选择器两种,前者两个冒号,后者一个冒号,但是浏览器都看做一个冒号 1.a.::first-line 逐层匹配,直到有文本元素且结束改行为止 设置css属性word-break:b ...

  5. 【CSS】自定义checkbox样式

    修改原生checkbox样式. 效果 原理 1.利用CSS3属性 appearance. 该属性(强制)更改(改变)默认(原生)样式. Firefox 支持替代的 -moz-appearance 属性 ...

  6. CSS 之自定义滚动条样式

    ::-webkit-scrollbar {/*滚动条整体样式*/ width: 5px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } ::-webkit-scrollbar-t ...

  7. pixi.js 自定义光标样式

    pixi 介绍 Pixi是一个超快的2D渲染引擎,通过Javascript和Html技术创建动画或管理交互式图像,从而制作游戏或应用. 项目地址:https://github.com/pixijs/p ...

  8. 「HTML+CSS」--自定义按钮样式【001】

    前言 Hello!小伙伴! 首先非常感谢您阅读海轰的文章,倘若文中有错误的地方,欢迎您指出- 哈哈 自我介绍一下 昵称:海轰 标签:程序猿一只|C++选手|学生 简介:因C语言结识编程,随后转入计算机 ...

  9. 「HTML+CSS」--自定义按钮样式【003】

    前言 Hello!小伙伴! 首先非常感谢您阅读海轰的文章,倘若文中有错误的地方,欢迎您指出- 哈哈 自我介绍一下 昵称:海轰 标签:程序猿一只|C++选手|学生 简介:因C语言结识编程,随后转入计算机 ...

随机推荐

  1. Rabbitmq -Routeing模式- python编码实现

    (using the pika 0.10.0 Python client) In the previous tutorial we built a simple logging system. We ...

  2. 一文彻底了解join的各种用法

    表a                       表b    a1    a2                 b1     b2 a01     张三         a02     数学 a02 ...

  3. php代码加密

    <?php function encode_file_contents($filename) { $type=strtolower(substr(strrchr($filename,'.'),1 ...

  4. WPF:父窗口与子窗口的层次关系

    关于子窗体的层级关系总结一下哈,希望能对大家有些帮助 假设有这样两个窗体:RootWindow,SubWindow,在RootWindow中引发某事件而显示SubWindow 1,如果弹出窗体(比如S ...

  5. Maven入门学习,安装及创建项目

    一.maven介绍: 1.maven是一个基于项目对象模型(POM Project Object Model),通过配置文件管理项目的工具(项目管理工具). 2.maven主要功能:发布项目(从编译到 ...

  6. 9月23日JavaScript作业----子菜单下拉

    例题一.子菜单下拉 <style type="text/css"> *{ margin:0px auto; padding:0px} #menu{ width:700p ...

  7. python线程锁

    import time,threading balance = 0 lock = threading.Lock() def change_it(n): global balance balance = ...

  8. 安装php时的配置选项

    ./configure --prefix=/home/samba/anthony/web --enable-mbstring --enable-fastcgi --enable-fpm --with- ...

  9. jQuery 参考手册 - 遍历

    jQuery 参考手册 - 遍历 jQuery Ajax jQuery 数据 jQuery 遍历函数 jQuery 遍历函数包括了用于筛选.查找和串联元素的方法. 函数描述 .add()将元素添加到匹 ...

  10. iOS项目重命名以及Xcode修改Scheme名称图文详解 (yoowei)

    在iOS开发中,有时候想改一下项目的名字,都会遇到很多麻烦.温馨提醒:记得备份. 看到项目名称,总感觉有点low,所以尝试着要将其更改一下. 项目原结构如下: 更改后的项目结构如下: 下面开始更改操作 ...