IE系列不支持CSS的圆角border-radius等属性的解决方案

针对IE系列不支持CSS的圆角border-radius等属性的问题，我们可以采用以下几种解决方案：

解决方案一：使用IE滤镜

IE系列浏览器支持通过滤镜来实现圆角效果。具体实现方式如下：

/* 设置圆角滤镜 */
div {
  border-radius: 10px; /* 优雅降级，对于支持 border-radius 属性的浏览器，直接设置圆角 */
  filter:progid:DXImageTransform.Microsoft.roundedCorners(10px); /* 设置IE系列浏览器圆角滤镜，需要使用px作为参数 */
}

需要注意的是，使用滤镜实现圆角会导致图层重绘，性能相对较差。

解决方案二：使用SVG

SVG的圆角效果在所有浏览器中都能够完美支持，因此我们可以通过在IE浏览器中使用SVG来实现圆角效果。具体实现方式如下：

div {
  border-radius: 10px; /* 优雅降级 */
  /* 设置SVG背景，实现圆角效果 */
  background-size: cover;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="50" r="50" /></svg>');
}

我们可以通过生成SVG背景图片的方式，来实现圆角效果。

以上两种方式可以满足绝大多数场景的需求，但需要注意的是，使用SVG方式实现圆角效果可能会影响网页的性能，因此需要谨慎使用。