CSS动态控制DIV居中
1.所谓的动态：就是即使手动去拖拉浏览器，DIV还是会自动居中
2.之前一直以为这个事情是JavaScript做的，
步骤：通过先获取页面的Height和Width，
然后定义DIV的Height和Width，
最后通过上面的值运算 DIV的top值 = (页面的Heght-Div的Height)/2
DIV的left值 = (页面的Width-Div的Width)/2
而且要想实现动态居中，还得在body中加上 onresize事件·····
总之很麻烦，很恶心，不过有一个优点，就是兼容绝大部分的浏览器
3. 后来查询资料发现，同样的动作居然用CSS也可以完成，而且更加简单，
对，没错，相当的简单易懂：
假设DIV控件的id是 popDiv：
#popDiv {
/*就是这个position:fixed起作用，生成相对定位的元素，相对于其正常位置进行定位。*/
position:fixed;
/*这里都是对外边距进行设置*/
margin:auto;
left:0;
right:0;
top:0;
bottom:0;
/*设置div的宽和高*/
width:400px;
height:280px;
/*设置超出范围后，就隐藏超出的部分*/
overflow: hidden;
/*设置边框*/
border: 2px solid #AEBBCA;
/*设置背景颜色*/
background-color: #EEF1F8;
/*设置鼠标的样式*/
cursor: move;
}
可以点击这里恶补以下position的知识：http://www.w3school.com.cn/cssref/pr_class_position.asp
优点：没错，就这样就可以实现我们的要求了，不仅居中，而且是动态居中
(不管是否有滚动条，或者拉动滚动条，或改变浏览器大小，这个div都始终居中显示在浏览器中)
缺点：不支持恐龙级别的古老神器IE6.0以下的浏览器
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
