相关疑难解决方法(0)

这是我的猫/动画的JSFIDDLE,没有任何 drop-shadows尽可能清楚地显示问题.根据我的理解,这是由于border-radius和可能由于overflow: hidden;.

猫头鹰不是这个问题的例子,只是我所处的类似情况的一个例子.这个问题是jsfiddle/cat,抱歉混淆了!

这是我的猫的JSFIDDLE,带有使用blura属性的插入框阴影,box-shadow并且像素化边缘在眼睛周围仍然是相同的.

这里的答案确实解决了我用猫头鹰图像看到的内容,但没有解释这个答案的内容.

这是inset box-shadow使用第三个值的一段时间的猫,blur.

我在Safari,Chrome和Firefox中测试了这个小提琴,它们似乎都显示相同.

我在Cheshire Cat上有两只眼睛,我昨天开始使用CSS.一切都渲染得非常好,我也制作了一个猫头鹰(我首先认为这是一个类似的情况,但它不是)出于CSS,在边缘像素化的眼睛上有一个非常小但类似的问题.

我也尝试给眼睛一个紫色的边框,但像素化的边缘在边缘边缘保持不变.

在我的新CSS创建中,眼睛的外边缘非常像素化,并且似乎是父圆的颜色(黄色).

这是眼睛的CSS.

.eye {
  border-radius: 50%;
  height: 100px;
  width: 100px;
  background: #FAD73F;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  overflow: hidden;
  position: relative;
  display: inline-block;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.4);
  z-index: 100;
}

.pup {
  border-radius: 50%;
  height: 20px;
  width: 20px;
  background: …