Question

在IE 11中查看以下plunker现在显示Name列上的图钉图标。在FF或Chrome中查看引脚图标。任何想法为什么会这样？

http://plnkr.co/edit/RU4KnysM6s0aeYzI3KYJ?p=preview

.grid {
  width: 100%;
  height: 400px;
}

.ui-grid-pinned-container .ui-grid-header-cell {
  position: relative;
}

.ui-grid-pinned-container .ui-grid-header-cell:after {
  position: absolute;
  font-family: 'FontAwesome';
  content: '\f08d';
  font-size: .75em;
  right: 2em;
  top: 0.5em;
  width: 1em;
  height: 1em;
}

<!doctype html>
<html ng-app="app">
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-touch.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-animate.js"></script>
    <script src="http://ui-grid.info/docs/grunt-scripts/csv.js"></script>
    <script src="http://ui-grid.info/docs/grunt-scripts/pdfmake.js"></script>
    <script src="http://ui-grid.info/docs/grunt-scripts/vfs_fonts.js"></script>
    <script src="http://ui-grid.info/release/ui-grid.js"></script>
    <link rel="stylesheet" href="http://ui-grid.info/release/ui-grid.css" type="text/css">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="main.css" type="text/css">
  </head>
  <body>

<div ng-controller="MainCtrl">
  <div ui-grid="gridOptions" class="grid" ui-grid-pinning></div>
</div>


    <script src="app.js"></script>
  </body>
</html>

Answer 1

您的Plunkr演示在IE11中适合我。我想你的问题是IE实际上是在IE7模式下渲染你的页面。

如果您在IE中打开开发人员工具（ F12 ），您会在右上角看到一个下拉菜单，其中显示了正在呈现的版本：

enter image description here

如果默认情况下没有显示 11 ，您可以通过将IE添加到您的文档<head>告知IE不要这样做来解决此问题（如下所述：{{3 }}）：

<meta http-equiv="x-ua-compatible" content="IE=Edge"/>

字体很棒在IE 11中没有显示图钉图标

1 个答案: