IE在伪元素:before或:after中不显示SVG作为内容。

在伪元素::before或::after中显示SVG作为内容，需要使用background-image属性来引用SVG文件，并将其作为背景图像显示。

下面是一个示例代码，演示如何在伪元素中显示SVG作为内容：

.element::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url('path/to/your/svg.svg');
  background-size: cover;
}

请确保将path/to/your/svg.svg替换为你的SVG文件的正确路径。

请注意，这种方法可能无法在Internet Explorer（IE）浏览器中正常工作，因为IE不支持在伪元素中使用background-image属性来显示SVG作为内容。

为了解决这个问题，你可以考虑以下两种解决方法：

1. 使用基于JavaScript的解决方案：使用JavaScript检测浏览器是否为IE，并根据结果应用不同的样式。在IE中，可以使用<img>标签来替代伪元素，并将SVG作为实际内容显示。在其他现代浏览器中，继续使用伪元素和背景图像。

/* CSS */
.element::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url('path/to/your/svg.svg');
  background-size: cover;
}

/* JavaScript */
if (navigator.userAgent.indexOf("MSIE") !== -1 || !!document.documentMode === true) {
  var element = document.querySelector('.element');
  var img = document.createElement('img');
  img.src = 'path/to/your/svg.svg';
  element.insertBefore(img, element.firstChild);
}

2. 使用矢量图标库：考虑使用矢量图标库，例如Font Awesome或Ionicons等。这些图标库提供了大量的矢量图标，可以直接应用于HTML元素，而无需使用伪元素和SVG文件。这些图标库提供了跨浏览器和设备一致的显示效果。

<!-- HTML -->
<link rel="stylesheet" href="path/to/font-awesome/css/fontawesome.min.css">

<!-- CSS -->
.element::before {
  content: '\f007'; /* Unicode字符，代表Font Awesome中的一个图标 */
  font-family: "Font Awesome 5 Free"; /* Font Awesome的字体名称 */
  display: inline-block;
  width: 20px;
  height: 20px;
}

请确保将path/to/font-awesome/css/fontawesome.min.css替换为Font Awesome的CSS文件的正确路径。

这些方法可以帮助你在伪元素中显示SVG作为内容，并解决在IE中无法显示SVG的问题。