右浮动能干啥?

右浮动:float:right, 似乎比左浮动float:left少用多了。难道右浮动仅仅像左浮那样用于飘在右侧吗??其实不然,右浮动在某些特定情形下,还可用于迅速解决某些定位问题。

如果你的总框架用的是未浮动的div(居中设置), 而左侧框架用的是左浮动的div,左框架下还有子框架div,同时,右框架用了左浮动的div,右框架与左框架之间设置了margin-left的值,合并代码后在浏览器上一看,妈呀,右侧内容全部跑到左侧内容底部或者部分左侧内容底部了,你赶紧检查css样式表和html代码,弄了一个多钟头,汗都下来了,代码没错呀,右侧内容还是上不到右侧顶端。死的心都有了!怎么办?

来了来了,有一招一剑封喉且非常迅速地可实现右侧框架内的内容升顶居右。具体如下:

把右侧框架的css样式改为右浮动(假定你的右侧框架类名是right),再加一个绝对定位,代码改为:

.right {
		float:right;
		position:absolute;
		... ...
		}

其他内容不变,改完保存,刷新页面,嘿!右侧内容瞬间升顶居右了!

声明:这个方案奏效的前提是左右框架以及总框架的宽度关系必须是正确的,否则还是不可以的。同时,右侧框架的margin-left设定也可以去掉(没啥用了)。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值