html div绝对定位居中

今夜來看雪

于 2022-01-27 22:57:21 发布

阅读量537

点赞数 1

文章标签： html css3 css

本文链接：https://blog.youkuaiyun.com/weixin_44442366/article/details/122724875

版权

本文介绍了一种使用CSS实现元素在页面中水平垂直居中的方法。通过将父级元素设置为相对定位，子元素设置为绝对定位，并结合transform属性的translate函数，可以轻松实现这一效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<div class="parent-frame" style="position: relative;">
 
 利用绝对定位，配合translate移动到水平垂直居中。
 
 <div class="child-frame" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">
 
 </div>
 
</div>