一道面试题，如下：
第一问：如何居中div？
本来自己的想法是，直接在div上设置margin：auto；发现最后只是水平居中，竖直方向上并没有居中。
方法① 最坑的方法。
知道屏幕的height和width值，通过设置左边和顶部的margin值，达到居中的效果。（Ps：最蠢但是挺实用的方法，哈哈哈）
方法② position属性
将div设置为position：absolute；以body为父元素进行定位，代码如下：
div{height: 100px;width: 100px;background: red; position: absolute; top:0; left:0; bottom:0; right: 0; margin: auto; } </style> </head> <body> <div></div> </body>
此时，div在屏幕中央显示。（IE8以上兼容）
方法③ position+margin负值
div{height: 100px;width: 100px;background: red; position: absolute; top:50%; left:50%; margin: -50px 0 0 -50px; //两个值分别为高度的一半和宽度的一半 }
此时，也能得到相同的效果。（此方法的神奇之处在于IE6能够兼容）