.nav_mid圖片不顯示以及圖片亂序和列表亂序問(wèn)題
按照老師寫的
結(jié)果是這樣:
然后在.logo加了overflow:hidden;
結(jié)果就這樣了:
請(qǐng)問(wèn)大神門怎么才能把.nav_mid的圖片顯示出來(lái),還有就是圖片亂序和列表亂序問(wèn)題
按照老師寫的
結(jié)果是這樣:
然后在.logo加了overflow:hidden;
結(jié)果就這樣了:
請(qǐng)問(wèn)大神門怎么才能把.nav_mid的圖片顯示出來(lái),還有就是圖片亂序和列表亂序問(wèn)題
2016-08-25
舉報(bào)
2016-08-25
這個(gè)是我寫的導(dǎo)航欄,已測(cè)試沒(méi)有問(wèn)題,你對(duì)照一下
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8">
<title>導(dǎo)航菜單</title>
<style type="text/css">
*{margin: 0;padding: 0;}
body {font-family: 'Microsoft Yahei';}
.nav {
????width: 1000px;
? ? height: 40px;
????margin: 10px auto;
}
.nav_left {
????width: 10px;
????height: 40px;
????background: url(file:///E:/html/images/nav_left.jpg) no-repeat;
????float: left;
}
.nav_mid {
????width: 980px;
????height: 40px;
????background: url(file:///E:/html/images/nav_bg.jpg) repeat-x;
????float: left;
}
.nav_right {
????width: 10px;
????height: 40px;
????background: url(file:///E:/html/images/nav_right.jpg) no-repeat;
????float: left;
}
/* 下面是左側(cè)菜單和右側(cè)搜索框樣式*/
.nav_mid_left,.nav_mid_right {
????float: left;
}
.nav_mid_left {
????width: 680px;
}
.nav_mid_right {
????width: 300px;
}
.nav_mid_left li {
????list-style-type: none;
????float: left;
????line-height: 40px;
????text-align: center;
????width: 100px;
}
.nav_mid_left a {
????text-decoration: none;
????font-size: 16px;
}
.nav_mid_left a:link,.nav_mid_left a:visited {color: #fff;}
.nav_mid_left a:hover,.nav_mid_left a:active {color: #ff0;}
.search_text {
????width: 190px;
????height: 25px;
????margin-top: 8px;
????background: url(file:///E:/html/images/search.jpg) no-repeat right center #fff;
????padding-right: 27px;
????border: 1px solid #fff;
}
</style>
</head>
<body>
<div class="nav">
<div class="nav_left"></div>
<div class="nav_mid">
<div class="nav_mid_left">
<ul>
<li><a href="#">首頁(yè)</a></li>
<li><a href="#">關(guān)于慕課</a></li>
<li><a href="#">新聞動(dòng)態(tài)</a></li>
<li><a href="#">課程中心</a></li>
<li><a href="#">在線課程</a></li>
<li><a href="#">人才招聘</a></li>
</ul>
</div>
<div class="nav_mid_right">
<form action="" method="post">
<input type="text" name="" class="search_text" />
</form>
</div>
</div>
<div class="nav_right"></div>
</div>
</body>
</html>
2016-08-25
2016-08-25
好像沒(méi)有添加無(wú)序列表左浮動(dòng)