.top-nav{

                font-size: 12px;

                font-weight: bold;

                list-style-type: none;

                border-bottom: 8px solid #DC4E1B;

                overflow: auto;/*hidden与auto的效果一样*/

                /*不是用来控制溢出，而是用来清除浮动，不是在该元素上清除浮动，而是清除自己*/

                /*应用了overflow的元素，扩展到他需要的大小，以包围他里面浮动的子元素*/

            }

【总结整理】overflow: auto/hidden;清除自己的更多相关文章

  1. overflow:auto/hidden的应用

    一.自适应两栏布局 <!DOCTYPE html><html lang="zh-CN"><head> <meta charset=&quo ...

  2. overflow:hidden清除浮动原理

    overflow:hidden的意思是超出部分去掉,如果父元素height为auto,内部元素浮动,势必会将内部元素全部隐藏,故计算出内部浮动高度顺便清除浮动.

  3. 为什么设置overflow为hidden可以清除浮动带来的影响

    1.问题起源 在平时的业务开发写CSS中,为了满足页面布局,元素的浮动特性我们用的不能再多了.使用浮动的确能够解决一些布局问题,但是也带了一些副作用影响,比如,父元素高度塌陷,我们有好几种可以清除浮动 ...

  4. CSS清除浮动常用方法小结 CSS clear both {overflow:auto;zoom:1;}

    常用的清除浮动的方法有以下三种: 此为未清除浮动源代码,运行代码无法查看到父级元素浅黄色背景 <!DOCTYPE html><html><head> <met ...

  5. 详解为什么设置overflow为hidden可以清除浮动带来的影响

    1.问题起源 在平时的业务开发写CSS中,为了满足页面布局,元素的浮动特性我们用的不能再多了.使用浮动的确能够解决一些布局问题,但是也带了一些副作用影响,比如,父元素高度塌陷,我们有好几种可以清除浮动 ...

  6. overflow:hidden清除浮动原理解析及清除浮动常用方法总结

    最近在看<CSS Mastery>这本书,里面有用overflow:hidden来清理浮动的方法.但是一直想不明白为什么能够实现清除浮动,查阅了网络上的解释,下面来总结一下. 一.首先来想 ...

  7. CSS 的overflow:hidden (清除浮动)

    verflow:hidden这个CSS样式是大家常用到的CSS样式,但是大多数人对这个样式的理解仅仅局限于隐藏溢出,而对于清除浮动这个含义不是很 了解.一提到清除浮动,我们就会想到另外一个CSS样式: ...

  8. overflow:auto学习

    一直认为没认为这个属性没什么大的用处,最近在使用一次iscroll时一直浮动到顶部层上面找了半天,发现可以用这个属性解决. 1.功能1,清除浮动.设置overflow并不会在该元素上清除浮动,它将清除 ...

  9. 小tip:CSS vw让overflow:auto页面滚动条出现时不跳动

    原文地址:http://www.zhangxinxu.com/wordpress/?p=4552 一.水平居中布局与滚动条跳动的千年难题 当前web届,绝大多数的页面间布局都是水平居中布局,主体定个宽 ...

随机推荐

  1. MYSQL:基础——事务处理

    MYSQL:基础——事务处理 事物处理 1.什么是事物处理 事务处理(transaction processing)可以用来维护数据库的完整性,它保证成批的MySQL操作要么完全执行,要么完全不执行 ...

  2. Never Go Away

    Hey if you ever want to leave it allif you ever want to lose control leave it all escape so far away ...

  3. maven 相关插件

    maven打包配置,到底要打包哪些文件,如何配置??使用如下插件: <build> <finalName>weatherAdminSys</finalName> & ...

  4. 算法（Algorithms）第4版 练习 2.1.24

    代码实现: package com.qiusongde; import edu.princeton.cs.algs4.In; import edu.princeton.cs.algs4.StdOut; ...

  5. Hive- Hive 按时间定期插入分区表

    写个shell脚本Hive 按时间定期插入分区表,由于今天统计的是昨天的数据所以日期减一. #!/bin/bash DT=`date -d '-1 day' "+%Y-%m-%d" ...

  6. 分享知识-快乐自己：快速理解（Java内部类）

    1):成员内部类 什么是内部类?: 内部类就是在一个类中定义另一个类. 定义语法: 使用命令行查看编译 产生的文件: 如何生成内部类对象? 创建规则:内部类对象 需要先声明外部类对象. 内部类以及外部 ...

  7. Selenium-几种操作

    元素定位之后就要对它进行操作了,常见的集中操作如下: click() 点击元素 eg.输入内容后,点击操作 send_keys("内容") 模拟按键输入 eg:百度输入框,输入内容 ...

  8. 一篇 jQuery 常用方法及函数的文章留存备忘。

    jQuery 常见操作实现方式 $("标签名") //取html元素 document.getElementsByTagName("") $("#ID ...

  9. pyqt5信号与槽2

    信号和槽与类的属性和方法在层次上是相同的,同属与一个类的特征. 信号的定义由工厂函数生成: signal=PyQt5.QtCore.pyqtSignal(types[, name[, result[, ...

  10. 用截取的部分图像创建新图像--关于cvGetSubRect，cvGetImage的用法

    CvMat* cvGetSubRect(const CvArr* arr, CvMat* submat, CvRect rect)可以把截取图像中需要的区域存入矩阵.把IplImage *传给arr, ...