css 布局之:左右及多列等高

用css布局时,我们经常会感觉css也有他的缺点,比如:两列、多列时,高度不能统一(尤其是有图片时,美观度会大打折扣),做标题栏时,标题在左,more在右,这样用css实现比较有点困难,尤其是more为图片时,其不能垂居中,这样用css布局很烦恼。   下面我来说一下,左右及多列等的实现方法。

left

left

left

left

left

center

……(20个或更多个)

center

  CSS 代码: *{ margin:0; padding:0; } #wrap{ overflow:hidden; width:1000px; margin:0 auto; } #left,#center,#right{ margin-bottom:-10000px; padding-bottom:10000px; } #left{ float:left; width:250px; background:#00FFFF; } #center{ float:left; width:500px; background:#FF0000; } #right{ float:right; width:250px; background:#00FF00; }   以上代码是我从网上看到的,其思想是:把内容把box拉到一个足以高的长度,然后,隐藏多的部分,这是其外边的content的height overflow 就显示出了css的优越性。有人又要问了,margin-bottom:-1000px;这是什么意思,平时见到的都是正值,负值如何理解,告诉下面的元素往上推。    但是我在ie5下测试,发现还是不够完美,于是我在content 的属性中加了zoom:1 问题圆满解决。 拿出来分享一下,希望遇到此

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值