现在位置:主页>网页设计>CSS教程> 正文
div+css设计网页时浮动问题的解决方法

日期:2008-04-20 点击: 编辑:53vi.Com 来源:网络

    以前我最常用的方法有两种:

    方法一、

资讯先锋网

      使用块级clear,即声明一个块的类属性为.clear {clear:both;}

53vi.Com

    方法二、 53vi.Com - [资讯前沿 技术先锋]

      使用内联元素清理,比如说在主浮动内容后跟一个内联元素。 53vi.Com - [资讯前沿 技术先锋]

    .inlineclear {clear:both;} 53vi.Com - [资讯前沿 技术先锋]

    <span class="inlineclear"></span>

53vi.Com

    方法三,使用双层div嵌套 53vi.Com

    #pubpage {display:block;clear:both;}
    #main {display:block;float:left;}
    <div id="pubpage">
        <div id="main">
        内容
        </div>
    </div> 53vi.Com

    这样用的话,内部的main就会把浮动给撑起来 53vi.Com

    方法四、 资讯先锋网

    /******clear float*******/
    .clearfix:after {
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }

53vi.Com

    .clearfix {display: inline-table;} 53vi.Com

    /* Hides from IE-mac \*/
    * html .clearfix {height: 1%;}
    .clearfix {display: block;}
    /* End hide from IE-mac */

53vi.Com - [资讯前沿 技术先锋]

    加在一个想表示成块的容器的类属性上,但此属性必须为第一个,如<div class="clearfix votelist" id="votelist">

资讯先锋网

    第四种方法目前可以很好的兼容多种浏览器,并且不要加额外的元素就可以完成想要的布局,原文请看这里 http://www.positioniseverything.net/easyclearing.html 资讯先锋网

    有了以上这几种方法,你在用div+css布局时就不会有那以多的苦恼了。 53vi.Com

    文章均转载自各媒体,转载目的在于传递更多信息,本网不对其观点与其真实性负责.如有版权问题请 [联系我们]
评论事项:请自觉遵守互联网相关政策法规。不能超过250字,需审核!
用户名: 密码:
匿名评论
 注册