居中位置：固定元素_随笔

居中位置：固定元素

基本上，您需要设置div

top

并将

left

其

50%

居中放置在div的左上角。您还需要将

margin-top

和设置为

margin-left

div的高度和宽度的负一半，以将中心移到div的中间。

因此，在提供

<!DOCTYPE html>

（标准模式）的情况下，此 *** 作应：

position: fixed;width: 500px;height: 200px;top: 50%;left: 50%;margin-top: -100px; margin-left: -250px;

或者，如果你不关心垂直和旧的浏览器，如IE6 / 7为中心，那么你就可以代替也增加

left: 0

，并

right: 0

以该元素具有

margin-left

和

margin-right

的

auto

，使得具有固定宽度的固定定位的元素知道在哪里的左，右偏移开始。因此，在您的情况下：

position: fixed;width: 500px;height: 200px;margin: 5% auto; left: 0;right: 0;

同样，如果您关心IE，则仅在IE8 +中有效，并且仅水平居中而不垂直。

欢迎分享，转载请注明来源：内存溢出

居中位置：固定元素