图标显示不出

老师，我的图标显示不出是因为电脑关系还是什么什么问题吗？

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>综合案例</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
   <div class="main" id="main">
      <div class="menu-box"></div>
      <!--主菜单-->
      <div class="menu-content">
         <div class="menu-item">
            <a href="">
               <span>首页 </span>
                <i>&#xe665;</i>
            </a>
         </div>
         <div class="menu-item">
            <a href="">
               <span>电视剧</span>
                 <i>&#xe665;</i>
            </a>
         </div>
         <div class="menu-item">
            <a href="">
               <span>动漫</span>
                <i>&#xe665;</i>
            </a>
         </div>
         <div class="menu-item">
            <a href="">
               <span>综艺</span>
                 <i>&#xe665;</i>
            </a>
         </div>
         <div class="menu-item">
            <a href="">
               <span>电影</span>
                  <i>&#xe665;</i>
            </a>
         </div>
      </div>
    <!--图片轮播-->
      <div class="banner" id="banner">
          <a href="">
             <div class="banner-slide slide1 slide-active"></div>
          </a>
          <a href="">
             <div class="banner-slide slide2"></div>
          </a>
          <a href="">
             <div class="banner-slide slide3"></div>
          </a>
      </div>
        <!--上一张，下一张按钮-->
        <a href="javascript:void(0)" class="button prev" id="prev"></a>
        <a href="javascript:void(0)" class="button next" id="next"></a>
        <!--圆点导航-->
        <div class="dots" id="dots">
           <span class="active"></span>
           <span></span>
           <span></span>
        </div>
   </div>
   <script src="js/script.js"></script>
</body>
</html>

*{
	margin: 0;
	padding: 0;
}

@font-face{
  font-family:"iconfont";
  src:url("../image/font/icofont.eot");
  src:url("../image/font/icofont.eot") format("embedded-opentype"),
      url("../image/font/icofont.woff") format("woff"),
      url("../image/font/icofont.ttf") format("truetype"),
      url("../image/font/icofont.svg#iconfog") format("svg");
}

ul{
	list-style: none;
}
body{
	font-family: "微软雅黑";
	color: #14191e;
}
.main{
	width: 1200px;
	height: 400px;
	margin: 30px auto;
	overflow: hidden;
	position: relative;
}
.banner{
	width: 1200px; 
	height: 400px;
	overflow: hidden;
  position: relative;
}
.banner-slide{
	width: 1200px;
	height: 400px;
	background-repeat: no-repeat;
	position: absolute; 
	display: none;
 }
.slide1{
  background-image: url("../image/name.png");
}
.slide2{
  background-image: url("../image/background.jpg");
}
.slide3{
  background-image: url("../image/sky.jpeg");
}
.slide-active{
	display: block;
}
.button{
	position: absolute;
	width: 40px;
	height: 80px;
	left: 244px;
	top:50%;
	margin-top:-40px;
	background: url("../image/arrow.png")  no-repeat center center ;
	}

.prev{
	transform: rotate(180deg);
}
.next{
	left:auto;
	right: 0;
}
.button:hover{
	background-color:#f8f8ff;
	opacity: 0.8;
	filter: alpha(opacity=80);
}
.dots{
	position: absolute;
	right: 20px;
	bottom: 24px;
	text-align: right;
}
.dots span{
	display: inline-block;
	width: 12px;
	height:12px;
	border-radius: 50%;
	background: rgba(7,17,27,0.4);
	line-height: 12px;
	margin-left: 8px;
	box-shadow:0 0 0 2px rgba(255,255,255,0.8) inset;
	cursor: pointer;
}
.dots .active{
	box-shadow: 0 0 0 2px rgba(7,17,27,0.4) inset;
	background: #fff;
}
/*导航菜单*/
.menu-box{
	width:244px;
	height: 460px;
	position: absolute;
	left: 0;
	top:0;
  background:rgba(7,17,27,0.5);
  opacity: 0.5;
  z-index: 1;
}
.menu-content{
	width: 244px;
	height: 454px;
	position: absolute;
	left: 0;
	top: 0;
	z-index:2;
	padding-top: 6px;
}
.menu-item{
	height: 64px;
	line-height: 66px;
	font-size: 16px;
	padding: 0 24px;
	position: relative;
}
.menu-item a:link,.menu-item a:visited{
	color:#fff;
}
.menu-item a{
	display: block;
	border-bottom: 1px solid rgba(255,255,255,0.2);
	padding: 0 8px;
	height: 63px;
}
.menu-item i{
	position: absolute;
	right: 32px;
	font-size: 24px;
	top: 2px;
	font-family: "iconfont";
	font-style: normal;
	font-weight: normal;
}

勤劳学生 2020-04-27

源自：项目：JavaScript轮播图 4-2 导航菜单样式