                        課程
                    
                        /前端開發(fā)
                        
                            /HTML/CSS
                        
                        /企業(yè)網(wǎng)站綜合布局實(shí)戰(zhàn)

loading圖竟然跑到了頭頂還有圖片都顯示不出來了

<!DOCTYPE html>
<html lang="en">
<head>
? ?<meta charset="UTF-8">
? ?<title>website-top</title>
? ?<script src="http://localhost:63342/untitled/myfocus-2.0.1.min.js" type="text/javascript"></script>
? ?<script src="http://localhost:63342/untitled/mf-pattern/mF_YSlider.js" type="text/javascript"></script>
? ?<link href="http://localhost:63342/untitled/mf-pattern/mF_YSlider.css" rel="stylesheet" type="text/css"/>
? ?<style>
? ? ? ?*{margin: 0px;
? ? ? ?padding: 0px;
? ? ? ?font-size: 12px;
? ? ? ?}
? ? ? ?body{
? ? ? ? ? ?background-color: #f5f5f5;
? ? ? ?}
? ? ? ?.top{
? ? ? ? ? ?width: 100%;
? ? ? ? ? ?height: 27px;
? ? ? ? ? ?border: 1px ?solid #ccbdb8;

? ? ? ?}
? ? ? ?.top-con{
? ? ? ? ? ?width: 1000px;
? ? ? ? ? ?margin: 0 auto;
? ? ? ?}
? ? ? ?.top-con li{
? ? ? ? ? ?width: 70px;
? ? ? ? ? ?line-height: 27px;
? ? ? ? ? ?float: right;
? ? ? ? ? ?text-decoration: none;

? ? ? ?}
? ? ? ?.top-con li a{
? ? ? ? ? ?text-decoration: none;
? ? ? ?}
? ? ? ?.top-con li a:hover{
? ? ? ? ? ?color:red;
? ? ? ?}
? ? ? ?.top-con li a:link,a:visited{
? ? ? ? ? ?color: rgba(0, 0, 0, 0.56);
? ? ? ? ? ?text-decoration: none;

? ? ? ?}
? ? ? ?.wrap{
? ? ? ? ? ?width: 1000px;
? ? ? ? ? ?margin: 0 auto;
? ? ? ?}
? ? ? ?.logo{
? ? ? ? ? ?height:80px;
? ? ? ? ? ?background-color: white;
? ? ? ?}
? ? ? ?.logo_left{
? ? ? ? ? ?width: 200px;
? ? ? ? ? ?float:left;
? ? ? ?}
? ? ? ?.logo_right{
? ? ? ? ? ?height: 28px;
? ? ? ? ? ?width: 300px;
? ? ? ? ? ?float:right;
? ? ? ? ? ?margin-top: 30px;
? ? ? ? ? ?color:#8e8e8e ;
? ? ? ?}
? ? ? ?.logo_right img{
? ? ? ? ? ?vertical-align:middle;
? ? ? ? ? ?marin-right:20px
}
? ? ? ?.tel{
? ? ? ? ? ?font-family:"微軟雅黑" ;
? ? ? ? ? ?font-size: 16px;
? ? ? ? ? ?color:#c00;
? ? ? ?}
? ? ? ?.nav{
? ? ? ? ? ?height: 40px;
? ? ? ? ? ?background-color: darkslategrey;
? ? ? ?}
? ? ? ?.nav_left{
? ? ? ? ? ?width:10px;
? ? ? ? ? float: left;
? ? ? ? ? ?height: 40px;
? ? ? ?}
? ? ? ?.nav_middle{
? ? ? ? ? ?width: 980px;
? ? ? ? ? ?float: left;
? ? ? ?}
? ? ? ?.nav_middle_left{
? ? ? ? ? ?width:680px;
? ? ? ?}
? ? ? ?.nav_middle_right{
? ? ? ? ? ?width: 300px;
? ? ? ?}
? ? ? ?.nav_right{
? ? ? ? ? ?width:10px;
? ? ? ? ? ?float:left;
? ? ? ? ? ?height: 40px;
? ? ? ?}
? ? ? ?.nav_middle_right,.nav_middle_left{
? ? ? ? ? ?float:left;
? ? ? ?}
? ? ? ?.nav_middle_left li{
? ? ? ? ? ?float:left;
? ? ? ? ? ?text-decoration: none;
? ? ? ? ? ?width: 100px;
? ? ? ? ? ?text-align: center;
? ? ? ? ? ?line-height: 40px;
? ? ? ? ? ?list-style-type: none;
? ? ? ?}
? ? ? ?.nav_middle_left a:link,a:visited{
? ? ? ? ? ?text-decoration: none;
? ? ? ? ? ?color:#fff;
? ? ? ? ? ?font-size: 16px;
? ? ? ? ? ?font-family: "微軟雅黑";
? ? ? ?}
? ? ? ?.nav_middle_left a:hover,a:active{
? ? ? ? ? ?text-decoration: none;
? ? ? ? ? ?color:#ff0;
? ? ? ? ? ?font-size: 16px;
? ? ? ? ? ?font-family: "微軟雅黑";
? ? ? ?}
? ? ? ?.search_text{
? ? ? ? ? ?margin-top: 5px;
? ? ? ? ? ?width:190px;
? ? ? ? ? ?height: 25px;
? ? ? ? ? ?background: url("search.jpg") no-repeat right
? ? ? ? ? ?center;
? ? ? ? ? ?background-size:20px 20px ;
? ? ? ? ? ?background-color:white;
? ? ? ? ? ?padding-right:25px ;
? ? ? ? ? ?border:1px solid #fff;
? ? ? ?}
? ? ? ?.ad{
? ? ? ? ? ?height: 300px;

? ? ? ?}
? ? ? ?.pic li{
? ? ? ? ? ?width: 1000px;
? ? ? ? ? ?height: 300px;

? ? ? ?}
? ? ? ?.pic li img{
? ? ? ? ? ?width: 1000px;
? ? ? ? ? ?height: 300px;
? ? ? ?}

? ?</style>

? ?<script type="text/javascript">
myFocus.set({
? ?id:'picbox'
})
? ?</script>
</head>
<body>

<img src="loading.gif" height="95" width="156"/>
<div class="top">
? ?<div class="top-con">
? ? ?<ul> ?<li>
? ? ? ? ? ?<a href="#">聯(lián)系我們</a>
? ? ? ?</li>
? ? ? ?<li>
? ? ? ? ? ?<a href="#">產(chǎn)品介紹</a>
? ? ? ?</li>
? ? ? ?<li>
? ? ? ? ? ?<a href="#"> 設(shè)為主頁</a>
? ? ? ?</li>
? ? ?</ul>
? ?</div>
</div>
<div class="wrap">
? ?<div class="logo">
? ? ?<div class="logo_left">
? ? ? ?<img src="logo.jpg" alt="慕課網(wǎng)">
? ? ?</div>
? ?<div class="logo_right">
? ? ? ?<img src="ph.jpg" alt="服務(wù)熱線">24小時服務(wù)熱線 <span class="tel">123-456-7890</span>
? ?</div>
</div>
? ?<div class="nav">
? ? ? ?<div class="nav_left">

? ? ? ?</div>
? ? ? ?<div class="nav_middle">
? ? ? ? ? ?<div class="nav_middle_left">
? ? ? ? ? ? ? ?<ul>
? ? ? ? ? ? ? ? ? ?<li><a href="#">首頁</a></li>
? ? ? ? ? ? ? ? ? ?<li><a href="#">關(guān)于慕課網(wǎng)</a></li>
? ? ? ? ? ? ? ? ? ?<li><a href="#">新聞動態(tài)</a></li>
? ? ? ? ? ? ? ? ? ?<li><a href="#">課程中心</a></li>
? ? ? ? ? ? ? ? ? ?<li><a href="#">在線課程</a></li>
? ? ? ? ? ? ? ? ? ?<li><a href="#">人才招聘</a></li>
? ? ? ? ? ? ? ?</ul>
? ? ? ? ? ?</div>
? ? ? ? ? ?<div class="nav_middle_right">
? ? ? ? ? ? ? ?<form action="" method="post">
? ? ? ? ? ? ? ? ? ?<input type="text" class="search_text"/>
? ? ? ? ? ? ? ?</form>
? ? ? ? ? ?</div>
? ? ? ?</div>
? ? ? ?<div class="nav_right">

? ? ? ?</div>
? ?</div>
? ?<div class="ad" id="picbox">
? ? ? ?<div class="ppp"><img src="loading.gif" alt="圖片加載中"/></div>
? ? ? <div class="pic">
? ? ? ?<ul>
? ? ? ? ? ?<li>
? ? ? ? ? ? ? <img src="1a.jpg"/>
? ? ? ? ? ?</li>
? ? ? ? ? ?<li>
? ? ? ? ? ? ? ?<img src="2a.jpg"/>
? ? ? ? ? ?</li>
? ? ? ? ? ?<li>
? ? ? ? ? ? ? ?<img src="3a.jpg"/>
? ? ? ? ? ?</li>
? ? ? ?</ul>
? ? ? </div>
? ?</div>
</div>

</body>
</html>