zoukankan      html  css  js  c++  java
  • css基础-2 div布局

    div布局

     

    <html>

            <head>

                    <title>div布局 </title>

                    <meta charset="utf-8">

                    <style>

          .toubu {100%;height:100px;background:aqua;}

          .zhuti {80%;height:600px;background:red;float:left;}

          .left  {20%;height:600px;background:green;float:left}

          .dibu  {100%;height:200px;background:blue;clear:both}

                    </style>

            </head>

            <body style=margin:0px;>

                    <div class="toubu">头部</div>

                    <div class="left">左边</div>

                    <div class="zhuti">主题部分</div>

                    <div class="dibu">底部</div>

            </body>

    </html>

     

    解释:

    1.div标签属于块级元素,自己会独占一行,要想让多个div从左到右排列,需要用到     "浮动"属性。

    2.最后一个div需要清除左浮动效果

           clear:both;

           属性意思为:不允许有浮动对象

    3.设置div头部的时候,头部会离浏览器最上边默认或有8px的间距。我们可以通过外边距标签,将8px的空白缝隙取消。

           style=margin:0px;

     

     

     

  • 相关阅读:
    hdu 2065
    hdu 1999
    hdu 1562
    hdu 1728
    hdu 1180
    hdu 1088
    hdu 2133
    很好的例子。。
    putty 多标签式浏览
    df
  • 原文地址:https://www.cnblogs.com/pangbing/p/7191198.html
Copyright © 2011-2022 走看看