overflow:hidden有两个用处经常用到:

1、通过设定自身的高度,加上overflow:hidden可以隐藏超过容器本身的内容;
     但是,小编在以往的使用中,发现了一个问题,只要父级容器设定了overflow:hidden,
     那么它的子孙元素都将会应用上去,并无法在内部消除,如果内部需要做div绝对定位position:absolute
     溢出效果,则会被隐藏掉,so 在运用overflow:hidden时,请慎用。

2、清除浮动,一说这个,大家肯定想到的是clear:both;
    但是,它们并不完全相同,overflow:hidden的清除浮动,是等于把居于它上空的人拉下来,关进自己盒子
    的那个层次(z-index)以下的空间,不能出去,所以产生了一个隐藏的效果,只有在盒子空间的那个缺口处,
   (就是容器本身的宽高范围内的可视界面)。

关于css中overflow:hidden的使用的更多相关文章

  1. css中overflow:hidden的属性 可能会导致js下拉菜单无法显示

    css中overflow:hidden属性导致ExtJS中无法显示下拉滚动条 overflow属性: visible 默认.内容不会被修剪,会呈现在元素之外. hidden 内容会被修剪,但是浏览器不 ...

  2. 转:css中overflow:hidden 不起作用了吗?

    css中overflow:hidden 不起作用了吗? 有同学遇到这样的问题,现象是给元素设置了overflow:hidden,但超出容器的部分并没有被隐藏,难道是设置的hidden失效了吗?其实看似 ...

  3. CSS中overflow:hidden

    CSS中,overfllow:hidden的作用是隐藏溢出 比如:<div style="width:300px;overflow:hidden" id=1><d ...

  4. css 中 overflow: hidden清楚浮动的真正原因

    1. 先上一段代码清楚浮动的代码, 外层ul设置overflow为hidden, 内层li设置float为left左浮动 <!DOCTYPE html> <html> < ...

  5. CSS中overflow:scroll怎么设置只上下滚动而不左右滚动

    CSS中"overflow:scroll"默认是左右,上下都滚动.怎么设置只上下滚动而不左右滚动,下面有个不错的解决方法 CSS中"overflow:scroll&quo ...

  6. 对CSS了解-overflow:hidden

    overflow:hidden 列出我在项目中,运用到此属性的例子: (1)暴力清除浮动 <style type="text/css"> .wrap {;backgro ...

  7. css ie7中overflow:hidden失效问题及解决方法

    css兼容ie7: 做页面的时候用负边距居中的时候在IE7下面,父节点中的overflow:hiden失效的问题,查阅了一些资料,总结一下解决方法. 问题原因: 当父元素的直接子元素或者下级子元素的样 ...

  8. 在ie7中overflow:hidden失效问题及解决方案

    css兼容ie7: 做页面的时候用负边距居中的时候在IE7下面,父节点中的overflow:hiden失效的问题,查阅了一些资料,总结一下解决方法. 问题原因: 当父元素的直接子元素或者下级子元素的样 ...

  9. CSS 的overflow:hidden 属性详细解释

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

随机推荐

  1. iOS开发——基本常识篇&各种控件默认高度

    各种控件默认高度   1.状态栏 状态栏一般高度为20像素,在打手机或者显示消息时会放大到40像素高,注意,两倍高度的状态栏在好像只能在纵向的模式下使用.如下图 用户可以隐藏状态栏,也可以将状态栏设置 ...

  2. EasyARM i.mx28学习笔记——开箱试用总结

    0 前言     本月初(2014年8月)购买了周立功的EasyARM开发板,主控为EasyARM i.mx287.出于下面几个理由购买了该开发板.     [1]主要原因,有人约我一起学习一起使用该 ...

  3. 详解 MySQL 中的 explain

    来源:persister 链接:http://www.blogjava.net/persister/archive/2008/10/27/236813.html 在 explain的帮助下,您就知道什 ...

  4. 不使用Math.random实现随机数。

    var rand = (function(){ var today = new Date(); var seed = today.getTime(); function rnd(){ seed = ( ...

  5. [转]windows下安装Object-C开发环境

    本文转自:http://hi.baidu.com/jeremylai/item/f40b9116cb3c5d582b3e22f5 在Windows下搭建Objective C开发环境,需要到GNUst ...

  6. 关于XML的DTD概述

    1 DTD概述 1.1 什么是DTD DTD(Document Type Definition),文档类型定义,用来约束XML文档.或者可以把DTD理解为创建XML文档的结构!例如可以用DTD要求XM ...

  7. 268条PCB Layout设计规范

    1 PCB布线与布局 PCB布线与布局隔离准则:强弱电流隔离.大小电压隔离,高低频率隔离.输入输出隔离.数字模拟隔离.输en入输出隔离,分界标准为相差一个数量级.隔离方法包括:空间远离.地线隔开. 2 ...

  8. fiddlercore 抓包获取cookie的方法

    public partial class form1 : Form { public form1() { string cookies = ""; InitializeCompon ...

  9. 【Objective-C】4-空指针和野指针

    一.什么是空指针和野指针 1.空指针 1> 没有存储任何内存地址的指针就称为空指针(NULL指针) 2> 空指针就是被赋值为0的指针,在没有被具体初始化之前,其值为0. 下面两个都是空指针 ...

  10. Less入门学习总结

    一.什么是Less   css的Less好比是js的Jquery,可以让人们更方遍快捷的使用css,使css代码更简洁,可以减少重复的代码,减少开发人员的工作量. Less CSS是一种动态样式语言, ...