29.布局

来源：互联网发布：eclipse java项目结构编辑：程序博客网时间：2024/06/15 15:10
布局

 <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>布局</title>    <style>        /*  css初始化样式 */        body{min-width:1000px;}        body,ul,ol,li,p,div,img,b,i,u,h1,h2,h3,h4,h5,h6{margin:0; padding:0; }        ul,ol{list-style:none; }        a{text-decoration:none;}        /*  top  start  */        #top{height:40px; background-color: #333;}        #top #top-center{ width: 1000px; height:40px;   margin:0 auto; }        #top #top-center .top-nav{            width: 800px; height:40px; line-height:40px;                float:left;                color:#B0B0B0;               overflow:hidden;}        #top #top-center .top-nav ul li{list-style:none; float:left; margin-right:5px;}        #top #top-center .top-nav ul li a{color:#B0B0B0;}        #top #top-center .top-cart{width: 100px; height:40px; float:right;}        #top #top-center .top-login{width: 100px; height:40px;  float:right;}        /*  top  end  */        #main{            width: 1000px;            min-height:595px;            background-color: orange;            margin: 10px auto;        }        #footer{            height:100px;            background-color: #ccc;        }    </style></head><body>    <div id='top'>        <div id='top-center'>            <div class='top-nav'>                <ul>                    <li><a href="">小米商城</a></li>                    <li> | </li>                    <li><a href="">MIUI</a></li>                    <li> | </li>                    <li><a href="">米聊</a></li>                    <li> | </li>                    <li><a href="">游戏</a></li>                    <li> | </li>                    <li><a href="">多看阅读</a></li>                    <li> | </li>                    <li><a href="">云服务</a></li>                    <li> | </li>                    <li><a href="">金融</a></li>                    <li> | </li>                    <li><a href="">小米网移动版</a></li>                    <li> | </li>                    <li><a href="">问题反馈</a></li>                    <li> | </li>                    <li><a href="">Select Region</a></li>                </ul>            </div>            <div class='top-cart'></div>            <div class='top-login'></div>        </div>    </div>    <div id='main'></div>    <div id='footer'></div></body></html>
阅读全文
0 0