Posts Tagged ‘DIV’
纯CSS右下角DIV浮动方法
星期五, 十二月 21st, 2012 85 views做一个右下角浮动的DIV,之前考虑用JS来取浏览器高度,然后利用float:right; margin:浏览器.hight-DIV.height来做。但根本不需要这么复杂。
代码如下:
1 2 3 4 5 6 7 8 | <div style="width:100px; height:100px; background-color:#fff; right:0px; bottom:0px; position:fixed;"> TEST DIV </div> |
但此代码只在FireFox、Chrome及IE6以上浏览器下有效,要支持IE6则需要将position改成absolute
1 2 3 4 5 6 7 8 | <div style="width:100px; height:100px; background-color:#fff; right:0px; bottom:0px; position:absolute;"> TEST DIV </div> |
这个时候所有浏览器的效果都统一了,但是有一个弊端就是不会随着滚动条滚动。
所以如果需要精确控制DIV的位置,推荐的方案还是使用JS。
BeiTown
2012.12.21