美文网首页
浮动溢出/清除浮动

浮动溢出/清除浮动

作者: 智多牛 | 来源:发表于2016-12-20 16:48 被阅读0次
  • 子对象浮动,父对象不设置高度,块元素就会塌陷
   <body>
        
        <!-- 顶部菜单 -->
        <div id="menu">
            <li>首页</li>
            <li>登录</li>
            <li>注册</li>
        </div>
        
        <!-- 底部版权 -->
        <div id="copyright">
            <li>版权</li>
            <li>关于</li>
            <li>联系</li>
        </div>
        
        
        <!-- 样式 -->
        <style>
            
            *
            {
                margin : 0;
                padding: 0;
            }
            
            
            /**
             * 父对象必须设置高度,否则就会塌陷,可以用overflow清除浮动
             */
            div
            {
                overflow: auto;
            }
            
            li
            {
                width: 100px;
                height: 50px;
                background-color: yellow;
                
                line-height: 50px;
                text-align: center;
                
                float: left;
            }
            
        </style>
        
    </body>

相关文章

  • 浮动溢出/清除浮动

    子对象浮动,父对象不设置高度,块元素就会塌陷

  • DIV+CSS布局3

    布局相关属性: 浮动属性——float:left right 清除浮动——clear:both 溢出处理——ov...

  • overflow:hidden 清除浮动,坍塌,溢出

    overflow:hidden清除浮动的作用在清除浮动中叙述;溢出隐藏是它最普遍的功能;坍塌: 原因:对于有块级子...

  • 11.22 前端学习

    清除浮动 clear:left清除左浮动clear:right清除右浮动clear:both清除对它影响最大的浮动...

  • 前端06

    清除浮动 clear:left清除左浮动clear:right清除右浮动clear:both清除对它影响最大的浮动...

  • 06 前端学习

    清除浮动 clear:left清除左浮动clear:right清除右浮动clear:both清除对它影响最大的浮动...

  • 一些常用的CSS样式

    清除浮动 文本溢出显示省略号 移动端样式重置 移动端文本溢出 后续....

  • 技术知识点整理

    清除浮动 BFC清除浮动浮动的父级末尾插入块级元素清除浮动 BFC(Block Formatting Contex...

  • css清除浮动

    前端开发中浮动处处可见,本文探讨浮动的成因以及如何更加有效的清除浮动。 1、浮动与清除浮动 2、清除浮动 基本cs...

  • 清除浮动

    未清除浮动前 清除浮动后

网友评论

      本文标题:浮动溢出/清除浮动

      本文链接:https://www.haomeiwen.com/subject/aeqfvttx.html