[分享]css3投影兼容ie11

CSS3是一种用于网页设计的样式语言，它不仅可以让网页看上去更加美观，还可以提高用户的交互体验。其中，CSS3的投影效果很受欢迎，但是在IE11浏览器中存在兼容性问题。/ 兼容IE11的投影效果 / ...

CSS3是一种用于网页设计的样式语言，它不仅可以让网页看上去更加美观，还可以提高用户的交互体验。其中，CSS3的投影效果很受欢迎，但是在IE11浏览器中存在兼容性问题。

/* 兼容IE11的投影效果 */
.box {
  /* box-shadow: 水平偏移量 垂直偏移量 模糊距离 阴影大小 阴影颜色(inset)-内阴影/外阴影; */
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
} 

为了在IE11浏览器中实现CSS3的投影效果，我们需要使用-ms-filter属性，它是IE浏览器特有的属性，用于应用微软的滤镜效果，通过设置滤镜属性的值来控制阴影的强度、方向和颜色。

但是，为了确保投影效果在其他浏览器中正常显示，我们还需要同时使用box-shadow属性。这个属性是CSS3的标准属性，它可以直接控制阴影的偏移、模糊度和颜色，在Chrome、Firefox、Safari和Edge浏览器中都可以正常使用。

总结来说，如果想要实现兼容IE11的投影效果，需要在CSS中同时使用-ms-filter和box-shadow属性，这样才能保证在所有主流浏览器中都能正常显示。