对CSS了解-overflow:hidden

overflow:hidden

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

（1）暴力清除浮动

<style type="text/css">.wrap {overflow: hidden;zoom:1;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:1;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:1;background-color: #ccc;}
</style><div class="left"></div>
<div class="right"></div>

转载于:https://www.cnblogs.com/focuslgy/p/3163239.html

对CSS了解-overflow:hidden相关推荐

css中overflow:hidden的属性可能会导致js下拉菜单无法显示
css中overflow:hidden属性导致ExtJS中无法显示下拉滚动条 overflow属性: visible 默认.内容不会被修剪,会呈现在元素之外. hidden 内容会被修剪,但是浏览器不 ...
overflow:hidden单行和多行文本溢出隐藏需要注意
1.单行文本溢出单行文本隐藏样式使溢出部分使用省略号显示,需要下面3个属性同时设置: overflow: hidden; white-space: nowrap; text-overflow: el ...
html清除溢出,深入理解CSS overflow:hidden——溢出,坍塌,清除浮动
overflow:hidden是overflow属性的一个神奇用法,它可以帮助我们隐藏溢出的元素,清除浮动和解除坍塌.当某一个属性拥有这么多的功能时,难免使人难以把握,不过不要怕,只要信:看完这篇文章 ...
CSS隐藏属性display:none；visibility:hidden；overflow:hidden
前端CSS元素隐藏的知识(display:none:visibility:hidden:overflow:hidden:opacity: 0) 欢迎来到CSS隐藏属性界面你好! 可以仔细阅读这篇文章 ...
论css中如何挣脱overflow:hidden;的限制
前言这个问题是在处理苏宁平台的官方旗舰店模板遇到的.苏宁限定的页面显示区域宽度为990px.模板可以自定义,但是嵌入的代码被包含在一个div里面.这个div被奇葩的设置了内嵌样式overflow:h ...
十、CSS三行代码实现溢出的文字省略号显示（white-space: nowrap;overflow: hidden;text-overflow: ellipsis;）
4. 溢出的文字省略号显示 4.1 white-space white-space设置或检索对象内文本显示方式.通常我们使用于强制一行显示内容 white-space:normal :默认处理方式wh ...
overflow:hidden;zoom:1 理解转__
overflow:hidden;zoom:1 http://hi.baidu.com/bbee888/item/ef80baf200de510085d27824 清除浮动的几种方法 1. 投机取巧法 ...
jquery 使用animate来改变高度自动添加样式overflow:hidden的问题
Another way is to declare the element as !important in css. For example. .somediv { overflow: visibl ...
CSS中overflow:scroll怎么设置只上下滚动而不左右滚动
CSS中"overflow:scroll"默认是左右,上下都滚动.怎么设置只上下滚动而不左右滚动,下面有个不错的解决方法 CSS中"overflow:scroll&quo ...

对CSS了解-overflow:hidden

对CSS了解-overflow:hidden相关推荐

最新文章

热门文章