1.前言
所以說一旦有不相容的彈出框，就自己畫了。畫多了，就習慣了。今天就分享乙個方法【但是這個方法的原理我竟然琢磨不透！】
2.詳情
**是這樣的，乙個div.point無寬高度，left:50%;top：50%;這樣的話，就會在頁面的正中間，然後div.pop設定了500px的寬高，居左，居上各-250px的距離。然後這個div.pop就會在頁面居中了；
然後效果圖是這樣的
然後這樣的話它就居中了。我一直不明白的就是，我並沒有設定position:relative，那麼這樣的話div就應該相對於body進行絕對定位了。我這個**中的第乙個div.point確實是相對於body進行絕對定位了。那麼我這第二個div的父級並沒有設定positon:relative。那麼它應該是不是也應該相對於body絕對定位呢。但是事實並不是這樣子呢，它是相對於div.point進行了絕對定位。【雖然效果實現了，但是原理並不是特別懂，求大神賜教】
我一直就是用這種方法做的彈出框。不過，實際應用中，最外層還得加乙個div。然後這個div設定成100%寬高度，posiotn:fixed;left:0;top:0;這樣的話彈出框居中了，滑鼠也滾動不了。效果較真實一點；
實現效果如下：
這樣的話，乙個居中的彈出框就實現了，在頁面的正中間。不過**實現了，原理不是特別懂，還希望各位對我進行指點一二，讓我能真正明白這個理！謝了。
3.總結
希望這種寫法能夠幫助到需要的小童鞋。也希望我文中的不足不要影響到大家，如果有錯誤的地方，請大家告之。
4.追加
根據大神程式猿到攻城獅之旅 的指點。我大概領會了。我上面的**要做一下修改.修改後如下。其實我根本不需要第乙個div.point。這個div設計top:50%;left:50%後，它的左上角那個點其實就已經在頁面中間了，這個時候，我只要向左向右移動想要的負畫素，就可以讓div往中間靠近了。這樣的話，更容易理解，而且更簡單。當然了，外層再加個div作為遮罩層還是很有必要的。
<body
>
<
div
style
="position:absolute;
top:50%;left:50%; width:500px; height:500px; margin-top:-250px; margin-left:-250px; border:2px solid red"
>
div>
body
>
css超簡單實現div頁面居中 適合做彈出框
1.前言 所以說一旦有不相容的彈出框，就自己畫了。畫多了，就習慣了。今天就分享乙個方法 但是這個方法的原理我竟然琢磨不透！2.詳情 是這樣的，乙個div.point無寬高度，left 50 top 50 這樣的話，就會在頁面的正中間，然後div.pop設定了500px的寬高，居左，居上各 250px...
CSS之通過定位簡單實現div絕對居中
上面是簡單 原理很簡單，即使用box來確定body的中間位置和寬高，content相對於box來定位即可實現居中。自感覺優點 相容好，不像vertical align等屬性ie不支援 定位都是用百分比，不用根據div的寬高來定位 簡單易用 用於頁面中單獨乙個居中框比較適用。缺點 每個居中的div需要...
css實現div水平 垂直居中
示例1 chrome33 ie8測試通過 示例2 chrome33 ie8測試通過 示例4 chrome33測試通過，ie8測試不通過，參考 注 對頁面中所有元素應用box sizing border box樣式是為了將padding margin值都計入width height中，即為元素指定的任...