CSS定位问题(2):float 和 display 的使用

lang=“en”>

     charset=“UTF-8”>

    </span><span class="crayon-i">inlineNav</span><span class="crayon-r">

     type=”text/css”>

    body, ul{margin:0;padding:0;}

        #body-div{

            background-color:#eaebea;

            height:40px;

            /*这里主要是让父级div跟据内容自动伸长*/

            display:inline-block;

            /*设置当浏览器窗口变短时li换行显示*/

            overflow:hidden;

            margin:0 auto;

        }

        ul li {

            list-style:none;

            display:inline-block;

            border-right:1px solid #d2d5d2;

            line-height:40px;

            padding:0 10px;

        }

        ul li a{

            text-decoration:none;

        }

        a:link, a:visited{color:#3f3b3c;}

        a:hover{color:#fd687f;}

    

     id=“body-div”>

        

                

  • href=“http://www.baidu.com” target=“_blank”>首页
  •             

  • href=“”>内容1
  •             

  • href=“”>内容2
  •             

  • href=“”>内容3
  •             

  • href=“”>内容4
  •             

  • href=“”>内容5
  •             

  • href=“”>内容6
  •             

  • href=“”>内容7
  •