浮动,定位,fixed网页中如下图，需要在页面底部中间固定一个块，当然用positon:fixed来控制，然后bottom:0px;能让其在底部，但是在中间怎么处理呢？
最先想到的是用js或者jquery算屏幕的宽度A，然后减去红色框的宽度B，那么它的left值为(A-B)/2 px;
其实有更简单的，只需要css来控制，代码如下
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <style> .test { border:1px solid red; position:fixed; bottom:0px; bottom:0px; left:0px; right:0px; margin:auto auto; height:50px; width:200px; } </style> </head> <body> <div class="test"></div> </body> </html>
重要之处就是left:0px;right:0px;margin:auto auto;
经测试在ie8、9、10，chrom、firefox中均正常
浮动,定位,fixed
|
