问答详情
源自：3-4 企业网站制作之导航部分制作（一）

一模一样的代码，我的效果也太诡异了……

54814a490001509305000107.jpg

始终想不明白哪里出错了……

为什么nav_right会出现在上面？？？而不是跟他们水平

float属性里面不是已经设置了么……

新手求教啊！！！！

css文件中代码：

.nav_left {

width: 10px;

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

}

.nav_mid{

width:980px;

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

}

.nav_right{

width:10px;

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

}

.nav_left,.nav_mid,.nav_right{

float:left;

height:40px;

}

index.html中的：

 <div class="nav">

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

     <div class="nav_mid">

       <div class="nav_mid_left"></div>

        <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 class="nav_mid_right">

         <form action="" method="post">

          <input type="text"/>

         </form>

       </div>

     </div><!-- nav-mid结束 -->

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

  </div><!-- nav结束 -->

</div><!--wrap结束  -->


提问者：ToBeCTO 2014-12-05 14:03

个回答

  • ThinkSummer
    2015-04-10 08:24:11

    老师为什么不用标准的html5教学?

    0
  • 我不是羊
    2014-12-24 19:41:57

    在头上加上这个就OK<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">


    5
  • baibm001
    2014-12-24 17:10:45

    同学你看看你的html 中 连doctype声明都没有，让浏览器如何解析

    0
  • 予尔心安
    2014-12-10 11:40:41

    应该是你宽度的问题,不是nav_left出现在上面,而是空间不够了,nav_mid和nav_right跑到下面来了

    0
  • ToBeCTO
    2014-12-05 18:22:29

    li暂时不管它的样式，我想问的是 为什么 nav_left 会出现在上面，实在是费解啊！

    0
  • Soully
    2014-12-05 17:54:29

    连li的样式的没有了，还说一模一样。你加上li{float:left;}就水平了

    0