Bootstrap (v3.3.4) glyphicons not displayed in IE when refresh page (F5)

问题

I am using the bootstrap v3.3.4 in application. I am also using some glyphicons. they work properly in FireFox, Chrome, and iPad, but they are not displayed in the Internet Explorer(Using IE10 & IE11) when you refresh the page (F5).

When the refresh page icon is not displayed but any button is clicked or page is reloaded for some severside action then the glyphicon appears and again when you refresh the page the glyphicon disappears.

Files structure:

Bootstrap >
- CSS
- Js
- Fonts

Please give me solution for this.

<!DOCTYPE html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<meta name="viewport" content="width=device-width, initial-scale=1" />
    
	<link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css">
</head>

<body>
	<div class="container"> 
	       	<p> <lablel>From:</label>
                <input type="text" class="form-control">
                <span class="glyphicon glyphicon-calendar"></span>
                <span class="glyphicon glyphicon-info-sign"></span> 

            </p>
	       	<p> <lablel>To:</label>
                <input type="text" class="form-control">
                <span class="glyphicon glyphicon-calendar"></span>
                <span class="glyphicon glyphicon-info-sign"></span> 

            </p>
	</div>

<script type="text/javascript" src="js/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
</body>
</html>

回答1:

Had the same problem with IE10 and IE11 refresh losing all glyphicons. This was due to https and was fixed by removing cache on the font file. Found the solution here: @font-face EOT not loading over HTTPS

来源：https://stackoverflow.com/questions/31536225/bootstrap-v3-3-4-glyphicons-not-displayed-in-ie-when-refresh-page-f5

标签

internet-explorer

twitter-bootstrap-3

glyphicons