为了账号安全,请及时绑定邮箱和手机立即绑定

尖尖头咋弄

http://img1.sycdn.imooc.com//5987ff230001f12c10770238.jpg

<!DOCTYPE html>

<html>

<head>

<script type="text/javascript" src="js/setHomeSetFav.js" charset="gb2312"></script>

<script type="text/javascript" src="js/myfocus-2.0.1.min.js"></script>

<script type="text/javascript" src="js/mf-pattern/mF_YSlider.js"></script>

<link rel="stylesheet" type="text/css" href="js/mf-pattern/mF_YSlider.css">

<style type="text/css">

*{

margin: 0;

padding: 0;

font-size:12px;

}

.top{

width: 100%;

height: 27px;

background-image: url(images/top_bg.jpg)repeat-x;

}

.top_content{

width: 1000px;

margin: 0 auto;

}

.top_content li{

list-style-image: url(images/li_bg.gif); 

margin: 0 5px;

float: right;

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: #900;

text-decoration:none;

}

.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:"宋体";

color: #900;

}

.nav{

width: 1000px;

height: 40px;

}

.nav_left{

width: 20px;

background: url(images/nav_left.jpg)no-repeat;

float: left;

height: 40px;

}

.nav_mid{

width: 980px;

background: url(images/nav_bg.jpg)repeat-x;

float: left;

height: 40px;

}

.nav_right{

width: 10px;

background: url(images/nav_right.jpg)no-repeat;

float: left;

height: 40px;

}

.nav_mid_left,.nav_mid_right{

float: left;

height: 100%;

}

.nav_mid_left{

width: 680px;

}

.nav_mid_right{

width: 300px;

}

.nav_mid_left ul{

height: 100%;

padding: 0px;

margin: 0px;

}

.nav_mid_left li{

list-style-type: none;

width: 100px;

text-align: center;

height: 40px;

display: table-cell; 

vertical-align: middle;

}

    .nav_mid_left a:link,.nav_mid_left a:visited{

    color:#fff;

    text-decoration:none;

    font-size: 12px;

    }

    .nav_mid_left a:hover,.nav_mid_left a:active{

    color:#ff0;

    text-decoration:none;

    font-size: 12px;

    }

   .search_text{

    width: 190px;

    height: 25px;

    margin-top:5px;

    background:url(images/search.jpg)no-repeat right center;

    background-color: white;

    padding-right: 25px;

   }

   .ad{

    height:310px;

    margin: 0 auto;

   }

   .ad li{

    list-style-type:none;

   }

   .ad ul{

    padding: 0px;

   }

   #myFocus{

    width: 1000px;

    height: 300px;

   }

   .num{

    height: 12px;

    z-index: 10000;

   }

   .main{

    height: 250px;

    background-color:blue;

   }

   .news{

    width: 340px;

    border: 1px solid #e8e8e8;

    background-color: #9FC;

   }

   .course{

    width: 410px;

    border: 1px solid #e8e8e8;

    background-color: #FF6;

   }

   .sidebar{

    width: 230px;

    background: #09F;

   }

   .news,.course,.sidebar{

    height: 

    float: left;

   }

   

</style>

<title></title>

</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 end-->

<div class="wrap">

<div class="logo">

<div class="logo_left">

<img src="images/logo.jpg">

</div>

<div class="logo_right">

<img src="images/tel.jpg"><span class="tel">telephone:142857000</span>

</div>

<div style="clear: both"></div>

</div><!--logo end-->

<div class="nav">

<div class="nav_left"></div>

<div class="nav_mid">

<div class="nav_mid_left">

<ul>

<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>

<li><a href="#">人才招聘</a></li>

       </ul>

</div>

<div class="nav_mid_right">

<form action="save.php" method="post">

<input class="search_text" type="text" name="text">

</form>

</div>

</div>

<div class="nav_right"></div>

</div><!--nav end-->

<div class="ad" id="picBox">

   <div class="pic">

<ul style="margin: 0;padding: 0">

<li><img src="images/ad2.jpg"/></li>

<li><img src="images/ad3.jpg"/></li>

<li><img src="images/ad4.jpg"/></li>

</ul>

   </div>  

</div>

 

 

</div><!--wrap end-->

</body>

</html>


正在回答

2 回答

这是logo图片部分83px超过了logo栏的80px,导致下一个div的内容从logo图片位置后面开始。

你加一个css代码就可以了

.logo_left img {
	display: block;
}


0 回复 有任何疑惑可以回复我~

你的菜单栏里面的3个div没有在同一行

<div class="nav_left"></div>

<div class="nav_mid">

<div class="nav_right">

因为块状元素默认占一行,如果想这个3个div在同一行,你可以在main.css文件里面把这3个div都设置左浮动(float:left)

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

尖尖头咋弄

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信