abstrakt:<style type="text/css">/* 首頁(yè)頭部樣式 */.nav-bg{height: 60px;line-height: 60px;overflow: hidden;background-color: #d51938;}.nav{background-color: #d51938 !important;}.nav .logo{float: left;
<style type="text/css">
/* 首頁(yè)頭部樣式 */
.nav-bg{height: 60px;line-height: 60px;overflow: hidden;background-color: #d51938;}
.nav{background-color: #d51938 !important;}
.nav .logo{float: left;width: 200px;}
.nav .logo a{display: block;}
.nav ul{float: left;width: 780px;margin-right: 10px;}
.nav ul li{float: left;position: relative;}
.nav ul li a{color: #fff;display: block;float: left;font-size: 16px;height: 60px;line-height: 60px;padding: 0 18px;}
.nav ul li a.current, .nav ul li a.on{background-color: #AA142D;}
.nav ul li a:hover{background-color: #AA142D;color: #fff;}
.nav ul li.sub-nav{width: 98px;text-align: center;}
.nav ul li.sub-nav a{padding: 0;width: 98px;}
.nav ul li .lis{position: absolute;width: 96px;display: none;top: 60px;left: 0;z-index: 999;border: 1px solid #ccc;border-top: 0;background-color: #fff;}
.nav ul li .lis li a{width: 96px;padding: 0;text-align: center;display: block;height: 34px;line-height: 34px;overflow: hidden;font-size: 14px;color: #333;}
.nav ul li .lis li a:hover{background-color: #f5f5f5;color: #d51938;}
.nav ul li .lis li a.on{background-color: #fff;}
.nav .login{float: right;color: #fff;font-size: 14px;width: 160px;}
.nav .login em{margin: 0 5px;display: inline-block;float: left;}
.nav .login a{display: inline-block;float: left;color: #fff;}
.nav .login a.name{width: 112px;height: 60px;line-height: 60px;overflow: hidden;text-align: right;}
.nav .login a.name img{width: 30px;height: 30px;border-radius: 50%;margin-right: 10px;margin-top: 14px;}
</style>
<div class="wapperout nav-bg ovisible">
<div class="wapper nav clearfix ovisible">
<div class="logo"><a href="" title=""><img src="temp/logo.png"></a></div>
<ul class="clearfix">
<li><a class="on" href="index.php">首頁(yè)</a></li>
<li class="sub-nav"><a class="cbox" href="esf.php">二手房</a>
<ol class="lis">
<li><a class="" href="">在售房源</a></li>
<li><a class="" href="">個(gè)人房源</a></li>
<li><a class="" href="">鄰校房</a></li>
<li><a class="" href="">找小區(qū)</a></li>
<li><a class="" href="">找經(jīng)紀(jì)人</a></li>
<li><a class="" href="">求購(gòu)</a></li>
<li><a class="" href="">我要賣(mài)房</a></li>
</ol>
</li>
<li class="sub-nav"><a class="cbox " href="rent.php">租房</a>
<ol class="lis">
<li><a class="" href="">個(gè)人租房</a></li>
<li><a class="" href="">整租房源</a></li>
<li><a class="" href="">合租房源</a></li>
<li><a class="" href="">求租</a></li>
<li><a class="" href="">我要出租</a></li>
</ol>
</li>
<li class="sub-nav"><a class="cbox " href="office.php">寫(xiě)字樓</a>
<ol class="lis">
<li><a class="" href="">寫(xiě)字樓出售</a></li>
<li><a class="" href="">寫(xiě)字樓出租</a></li>
<li><a class="" href="">寫(xiě)字樓求購(gòu)</a></li>
<li><a class="" href="">寫(xiě)字樓求租</a></li>
</ol>
</li>
<li class="sub-nav"><a class="cbox " href="shop.php">商鋪</a>
<ol class="lis">
<li><a class="" href="">商鋪轉(zhuǎn)讓</a></li>
<li><a class="" href="">商鋪出售</a></li>
<li><a class="" href="">商鋪出租</a></li>
<li><a class="" href="">商鋪求購(gòu)</a></li>
<li><a class="" href="">商鋪求租</a></li>
</ol>
</li>
<li><a target="_blank" class="" href="house.php">小區(qū)</a></li>
<li><a target="_blank" class="" href="news.php">資訊</a></li>
<li><a target="_blank" class="" href="agent.php">經(jīng)紀(jì)人</a></li>
</ul>
<div class="login"> <a href="login.php" class="name">登錄</a><em>|</em><a href="register.php">注冊(cè)</a> </div>
</div>
</div>
Korrigierender Lehrer:查無(wú)此人Korrekturzeit:2019-05-15 14:02:03
Zusammenfassung des Lehrers:完成的不錯(cuò)。常用的css樣式可以寫(xiě)個(gè)公用文件,繼續(xù)加油。