手机
当前位置:查字典教程网 >网页设计 >心得技巧 >CSS--overflow:hidden在项目实例中使用心得分享
CSS--overflow:hidden在项目实例中使用心得分享
摘要:列出我在项目中,运用到此属性的例子:(1)暴力清除浮动.wrap{overflow:hidden;zoom:1;background-col...

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

(1)暴力清除浮动

<style type="text/css">

.wrap {overflow: hidden;zoom:1;background-color: #ccc;}

.wrap p {float: left;}

</style>

<div>

<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>

<p>test of css</p>

</div>

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

<style type="text/css">

.line {height: 1px;background-color: #ccc;overflow: hidden;}

</style>

<div></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></div>

<div></div>

【CSS--overflow:hidden在项目实例中使用心得分享】相关文章:

对div盒子模型使用心得总结

css如何实现自定义更为美观的链接提示效果

优秀的网页前端设计的一些指标

判断浏览器版本的语句且可兼容多个浏览器

网页设计也要先对网站有全面形象定位

js、css、html判断浏览器的各种版本

去掉点击链接时出现的虚线框的几个方法

新手建站入门教程帖⑦:做一个漂亮的网站就这么简单

站长应该注意的9个提高网站易用性的代码优化技巧

目前流行的界面设计的十条规则

精品推荐
分类导航