                        課程
                    
                        /前端開發
                        
                            /JavaScript
                        
                        /商城分類導航效果

老師關于那個CSS的hover屬性，求教

body{margin:0;padding:0;}
#整體{margin:0?auto;width:95%;}
header{display:block;}
.rightbar{position:fixed;top:20px;right:10px;height:100%;z-index:3;
display:block;border-right:2px?solid?#F90;padding-top:50px;}
.rightbar?li{margin-bottom:25px;position:relative;list-style-type:none;
}
.rightbar?li:hover{}
.rightbar?li?a{display:block;height:30px;line-height:30px;background:#F90;text-decoration:none;text-align:center;color:white;width:50px;margin:10px?0;}
.rightbar?li?a:hover{background:#FFF;color:#333;}

.hpn{position:absolute;top:80px;right:70px;z-index:6;
opacity:0.1;}
.hpn?span{display:block;background:#FFC;}
.rightbar?li:hover.hpn{opacity:1;}
.rightbar?li:hover?span{display:inline-block;z-index:20;}

<body>
<div?id="整體">整體
????<header>1</header>
????<header>2</header>
????<div>1</div>
????<div>2</div>
????<div>3</div>
????????<ul?class="rightbar">
??????????<li><a?href="#">我</a>
????????????<div?class="hpn">
???????????????????<span>hello,friend!</span>??????
????????????</div>
??????????</li>
??????????<li><a?href="#">學校</a></li>
??????????<li><a?href="#">好友</a></li>
??????????<li><a?href="#">文檔</a></li>
??????????<li><a?href="#">消息</a></li>
??????????<li><a?href="#">插件</a></li>
????????</ul>??????
</div>
</body>

這個是我寫的一個代碼，根據老師所教的用CSS的hover屬性來顯示二級菜單，然后就出現了錯誤，這個是錯在哪了？