🚀
头像


我是神秘人

网页中如何让一个div垂直水平居中(绝对定位)

2022-10-21 19:35:31 108 💗 0 @

<body>
<div> <div class="box"></div> </div> </body> <style> .box { width: 200px; height: 200px; background-color: blue; position: absolute; left: 50%; top: 50%; margin-top: -100px; margin-left: -100px; } </style>
  • 绝对定位,上左为50%,再让上左外边距为: -(实际宽高/2)

<body>
  <div>
    <div class="box"></div>
  </div>
</body>

<style>
  .box {
    width: 200px;
    height: 200px;
    background-color: blue;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
  }
</style>
  • 绝对定位,上下左右为0,margin为auto


    目录导航

公告

昵称:

园龄:2年242天

注册时间:2021-11-16

当前在第:1

总共:1

搜索

优秀文章 7天获赞排行

  1.