关于使用position:relative居中的问题

最新推荐文章于 2025-06-07 20:47:06 发布

原创最新推荐文章于 2025-06-07 20:47:06 发布 · 1.3w 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#css #手机前端

本文探讨了使用CSS实现元素居中的方法，特别是position属性结合margin的用法。针对不同的position值（relative与absolute），文中详细分析了它们在不同设备及浏览器版本下的表现，并提出了相应的解决方案。

css 页面居种的方法中有一种 position:relative(absolute) ，top：50%;left:50%;margin-height/2 0 0 -width/2;当使用position :absolute时候，在手机浏览器上没有任何问题，但是，由于position :absolute不占据空间位置，所有当还有dom需要紧贴在改dom附近的时候，必须计算。使用position :relative则没有这个顾虑，但是position :relative在android4.3以前版本使用会导致margin没有任何作用，进而达不到居种效果。