overflow:hidden

列出我在项目中,运用到此属性的例子:

(1)暴力清除浮动

<style type="text/css">
.wrap {overflow: hidden;zoom:;background-color: #ccc;}
.wrap p {float: left;}
</style>
<div class="wrap">
<p>test of css</p>
</div>

(2)阻止边距外折叠

<style type="text/css">
body,p {padding: 0;margin: 0;}
.wrap {overflow: hidden;zoom:;background-color: #ccc;}
.wrap p {margin-top: 20px;}
</style> <div class="wrap">
<p>test of css</p>
</div>

(3)在IE-6,解决定义1px高的块元素

<style type="text/css">
.line {height: 1px;background-color: #ccc;overflow: hidden;}
</style>

<div class="line"></div>

(4)创建两栏布局

<style type="text/css">
div {height: 500px;}
.left {float: left;background-color: #000;width: 200px;margin-right: 5px;}
.right {overflow: hidden;zoom:;background-color: #ccc;}
</style> <div class="left"></div>
<div class="right"></div>

对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 属性详细解释

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

  4. CSS中overflow:hidden

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

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

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

  6. 关于css中overflow:hidden的使用

    overflow:hidden有两个用处经常用到: 1.通过设定自身的高度,加上overflow:hidden可以隐藏超过容器本身的内容:     但是,小编在以往的使用中,发现了一个问题,只要父级容 ...

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

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

  8. css & auto height & overflow: hidden;

    css & auto height & overflow: hidden; {overflow: hidden; height: 100%;} is the panacea! {溢出: ...

  9. JS弹出层制作,以及移动端禁止弹出层下内容滚动,overflow:hidden移动端失效问题

    HTML <div class="layer"> <div class="menu-list"> <span>社会</ ...

随机推荐

  1. Java HashMap工作原理及实现(转载)

    https://yikun.github.io/2015/04/01/Java-HashMap工作原理及实现/

  2. 转!!Java设置session超时(失效)的时间

    Java设置session超时(失效)的时间   在一般系统登录后,都会设置一个当前session失效的时间,以确保在用户长时间不与服务器交互,自动退出登录,销毁session具体设置的方法有三种:1 ...

  3. shell脚本杂

    1.sh -x 跟踪shell脚本中的每个命令 [root@master shellexer]# cat bash.sh #!/bin/bash var=$ echo $var [root@maste ...

  4. 报错:Cannot remove entries from nonexistent file c:\program files\anaconda3\lib\site-packages\easy-install.pth

    Outline 这两天通过“掘金量化终端”跑模型策略,之前装好环境一直ok,可以顺畅的Running~ 下午重装了下 Anaconda,刚才跑的时候提示 缺少“gm”模块 (掘金量化必须包): 就按照 ...

  5. 几分钟私人定制APP全攻略!!

    上网百度了一下什么是自媒体,你会看到这种介绍:自媒体(外文名:We Media)又称"公民媒体"或"个人媒体",是指私人化.平民化.普泛化.自主化的传播者,以现 ...

  6. phpexcel导出带生成图片完美案例

    // 导出exl public function look_down(){ $id = I('get.id'); $m = M ('offer_goods'); $where['offer_id'] ...

  7. WinForm TCP异步连接之服务器端

    C# — WinForm TCP连接之服务器端 TCP连接之服务器端,涉及到如下三个函数,分别是: /***************************** ** 函数功能: 服务端监听 ** 输 ...

  8. Java集合(7):HashMap

    一.HashMap介绍 HashMap是基于哈希表的 Map 接口的实现,以key-value的形式存在.在HashMap中,key-value总是会当做一个整体来处理,系统会根据hash算法来来计算 ...

  9. html基本标签介绍及应用

    <!-- html标签 特征: 1.空白折叠现象 2.对空格和换行不敏感 3.标签要严格封闭 p标签的嵌套 多注意!!!!!! html中: 1.行内标签(不换行) (1)在一行内显示 span ...

  10. Oracle数据库安全(二)资源限制于口令管理

    一.资源限制与口令管理概述 1.概要文件介绍: 在Oracle数据库中,用户对数据库和系统资源使用的限制以及对用户口令的管理的是建立概要文件实现的.它是Oracle数据库安全策略的重要组成不封.每个数 ...