為什么不定義nav的樣式 會出現“首頁”右側浮動的現象
html代碼：
<!DOCTYPE?html>
<html?lang="en">
<head>
????<meta?charset="UTF-8">
????<meta?name="viewport"?content="width=device-width,?initial-scale=1.0">
????<meta?http-equiv="X-UA-Compatible"?content="ie=edge">
????<title>Document</title>
????<link?rel="stylesheet"?href="../css/main.css"?type="text/css">
????<script?src="../js/jquery-1.4.4.min.js"?charset="gb2312"></script>
????<script?src="../js/setHomeSetFav.js"?charset="gb2312"></script>
????<script?src="../js/myfocus-2.0.1.min.js"?charset="gb2312"></script>
</head>
<body>
????<div?class="top">
????????<div?class="top_content">
????????????<ul>
????????????????<li><a?href="#">聯系我們</a></li>
????????????????<li><a?href="#"?onclick="AddFavorite(window.location,Document.title)">加入收藏</a></li>
????????????????<li><a?href="#"?onclick="SetHome(window.location)">設為首頁</a></li>
????????????????
????????????</ul>
????????</div>
????</div>?
????<!--top結束-->
????<div?class="wrap">
????????<div?class="logo">
????????????<div?class="logo_left">
????????????????<img?src="./../img/logo.jpg"?alt="慕課網">
????????????</div>
????????????<div?class="logo_right">
????????????????<img?src="./../img/tel.jpg"?alt="服務熱線">
????????????????小時服務熱線：<span?class="tel">177-5296-1997</span>
????????????</div>
????????</div>
????????<!--logo結束-->
????????<div?class="nav">
????????????<div?class="nav_leif"></div>
????????????<div?class="nav_mid">
????????????????<div?class="nav_mid_left">
????????????????????<ul>
????????????????????????<li><a?href="#">首頁</a></li>
????????????????????????<li><a?href="list.html">關于慕課</a></li>
????????????????????????<li><a?href="list.html">新聞動態</a></li>
????????????????????????<li><a?href="list.html">課程中心</a></li>
????????????????????????<li><a?href="list.html">在線課程</a></li>
????????????????????????<li><a?href="list.html">人才招聘</a></li>
????????????????????</ul>
????????????????</div>
????????????????<div?class="nav_mid-right">
????????????????????<form?action=""?method="POST">
????????????????????????<input?type="text">
????????????????????</form>
????????????????</div>
????????????</div>
????????????<div?class="nav_right"></div>
????????</div>
????????<!--?nav結束?-->
????</div>
????<!--?wrap結束?-->
????
</body>
</html>
css代碼：
*?{
????margin:?0;
????padding:?0;
????font-size:?12px;
}
body{
????background-color:?#F5F5F5;
}
.top{
????width:?100%;
????height:?27px;
????background:?url(../img/top_bg.jpg)?repeat-x;
}
.top_content{
????width:?1000px;
????margin:?0?auto;
}
.top_content?li{
????list-style-image:?url(../img/li_bg.gif);
????float:?right;
????width:?70px;
????line-height:?27px;
????
}
.top_content?a:link,.top_content?a:visited{
????color:?#8e8e8e;
????text-decoration:?none;
}
.top_content?a:hover,.top_content?a:active{
????color:?red;
????text-decoration:?none;?
????/*?text-decoration--文本下劃線?*/
????/*?active--活動狀態?*/
}
.wrap{
????width:?1000px;
????margin:?0?auto;
}
.logo{
????height:?80px;
????background-color:white;
}
.logo_left{
????width:?200px;
????float:?left;
}
.logo_right{
????width:?300px;
????float:?right;
????height:?28px;
????margin-top:?30px;
????color:?#8e8e8e;
}
.logo_right?img{
????vertical-align:?middle;??
????/*?垂直對齊圖像?:中間*/
????margin-right:?10px;
}
.tel{
????font-family:?微軟雅黑;
????font-size:?16px;
????color:?rgb(204,?5,?5);
}
2020-01-13
.logo {height: 84px;?
把.logo的高改為 84px
2019-12-27
把“首頁”注釋掉，之后，下邊的“關于慕課”也會又浮動