有个疑惑已久的问题,前段时间做CSS+div布局时候,发现水平让一个元素居中十分容易margin:0 auto;然而要做到垂直居中却没有找到可行的方案,以下是新发现的解决方案,整理如下:

 


效果缩略图如下:

Xhtml+css实践水平居中的设计方法

注意红色方块的中心点是浏览器窗口的中心,或者说是body元素的中心位置。

 

个人理解:

在此,我说下我的个人理解,该正方DIV元素如果要真正居中的话,实际上要做到让它的中心点居中才可以,用margin:-100px 0 0 -100px;实现让元素左移100px,再上移100px,从而实现了真正的中心点居中,绿色方块是没有用margin:-100px 0 0 -100px;之前的效果,红色部分是偏移后的效果。如此是否可以总结一点:margin-left,margin-top取负值的时候可以实现某种意义上的相对定位呢?

相关文章:

  • 2021-08-12
  • 2021-12-28
  • 2022-01-12
  • 2022-12-23
  • 2022-02-27
  • 2022-12-23
  • 2021-08-31
  • 2021-08-17
猜你喜欢
  • 2022-12-23
  • 2021-07-14
  • 2021-12-10
  • 2021-12-28
  • 2021-11-26
  • 2021-10-28
  • 2022-02-13
相关资源
相似解决方案