Question

毫不奇怪，在ms边缘浏览器中缩放效果看起来很糟糕。有没有办法一起禁用这个边缘？

.jumbotron__bg {
 -webkit-animation-name: animateBg;
 animation-name: animateBg;
 -ms-animation-name: none;

 animation-duration: 18000ms;
 animation-fill-mode: both;

 animation-timing-function: cubic-bezier(.3,0,.7,1);
 animation-iteration-count: 1;
}


@keyframes animateBg {
  from {
  transform: scale(1.05, 1.05);
  -ms-transform: scale(1,1);
 }

 to {
 transform: scale(1, 1);
 -ms-transform: scale(1,1);
 }
}

（即好，不适用于边缘）

Answer 1

您可以将@supports与仅支持Edge的属性一起使用;

这适用于Edge 12及更高版本（所有版本）：

@supports (-ms-ime-align: auto) {
     .jumbotron__bg {
         animation-name: none;
     }
}

〜或〜

这仅适用于Edge to v13

@supports (-ms-accelerator:true) {
     .jumbotron__bg {
         animation-name: none;
     }
}

CSS：删除边缘/即动画

1 个答案: