通過css選擇器class給元素添加cursor的坑
阿新 • • 發佈:2017-06-14
tex height ssh 等於 light help 通過 first foo
筆者在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的坑