css 相对浏览器动态居中永远保持在屏幕正中

要实现CSS相对浏览器动态居中，需要注意以下几点：

1.要居中的元素必须是块级元素，并且设置宽度。因为只有块级元素才能够设置宽度，设置宽度是为了让元素有一定的大小，方便元素进行居中。

2.要让元素水平居中，需要使用margin属性。可以通过margin-left和margin-right设置左右的空白间距，使得元素水平居中。当使用具体数值的时候，需要注意居中元素的宽高，以便计算出正确的margin值。

3.要让元素垂直居中，可以使用flex布局或者绝对定位结合transform属性来实现。而这两种方式的前提是，要先将居中元素的父元素的display设置为flex或position属性不为static，以便元素可以进行绝对定位或flex布局。

以下是两种实现示例：

示例一：

HTML代码：

<div class="container">
  <div class="box">我要实现浏览器动态居中</div>
</div>

CSS代码：

.container {
  display: table;
  height: 100%;
  width: 100%;
}
.box {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}

在这个示例中，我们使用了display:table属性来让.container的高度和宽度都自适应浏览器的大小。同时，将.box的display设置为table-cell，使用text-align:center和vertical-align:center实现水平和垂直居中。

示例二：

HTML代码：

<div class="container">
  <div class="box">我也要实现居中</div>
</div>

CSS代码：

.container {
  position: relative;
  height: 100%;
  width: 100%;
}
.box{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

在这个示例中，我们使用了绝对定位的方式，将.box的position属性设置为absolute，同时，使用top:50%和left:50%让元素位于父元素的正中央。最后，使用transform属性将元素的位置移动回左上角，从而实现垂直和水平的居中。