我已经上传了一个40x40正方形的.png. 该广场有一个白色透明的背景.
当使用此图像作为自定义光标时,我所期望的是,将鼠标悬停在红色块上时,我会看到一个暗淡的白色透明正方形.
当我将鼠标悬停在白色方块上时,我所期望的是什么都不是,因为我认为由于透明的白色覆盖了白色,所以该正方形应该是"看不见的".
但这并不是我们所看到的,这个正方形实际上是淡淡的灰色.这种转变从何而来?我try 过使用SVG和PNG.
FIDDLE in case example is not working. https://jsfiddle.net/cx2gu5qb/.
.block {
height: 200px;
width: 400px;
cursor: url('https://i.imgur.com/yuDNHeN.png'), auto;
}
.red {
background: red;
}
.white {
border: 1px solid black;
background: white;
}
<div class="block red"></div>
<div class="block white"></div>