码迷,mamicode.com
首页 > Web开发 > 详细

通过css选择器class给元素添加cursor的坑

时间:2017-06-14 14:18:21      阅读:215      评论:0      收藏:0      [点我收藏+]

标签:style   help   idt   value   height   highlight   pre   logs   cross   

笔者在chrome中遇到了奇特的问题,在通过class给元素添加cursor的自定义图片时。出现了"Invald property value"提示,crosshair、help等属性值可以生效。

图片却不行,自己研究后发现两个大坑。

一个是图片宽或者高需要有一边小于或等于32px。

另一个很重要就是不能用class选择器。

例如:

<style type="text/css">
.foo{
width:100px;
height:100px;
cursor:url(http://www.w3school.com.cn/ui2017/compatible_chrome.png)
}
</style>
<div class="fbox">
  <div class="foo"></div>
</div>

  这么写会被提示chrome "Invald property value",只能用.fbox div或者.fbox div:first-child来赋值样式属性。

<style type="text/css">
.fbox div{
width:100px;
height:100px;
cursor:url(http://www.w3school.com.cn/ui2017/compatible_chrome.png)
}
</style>
<div class="fbox">
  <div class="foo"></div>
</div>

  

通过css选择器class给元素添加cursor的坑

标签:style   help   idt   value   height   highlight   pre   logs   cross   

原文地址:http://www.cnblogs.com/eastegg/p/7008242.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!