CSS3 不定宽高水平居中

最新推荐文章于 2020-12-23 18:40:15 发布

原创最新推荐文章于 2020-12-23 18:40:15 发布 · 693 阅读

0 ·

CC 4.0 BY-SA版权

css3 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了两种使用CSS实现元素居中的方法：一是通过绝对定位配合transform属性；二是利用Flexbox布局，设置justify-content和align-items属性来实现水平和垂直居中。

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

  方法1
  #child { position: absolute; 
             top:50%; left: 50%; 
             transform : translate(-50%,-50%);
           }
  方法2 flex
  #parent { 
           justify-content: center;  /*子元素水平居中 */
           align-items:center;      /* 子元素垂直居中 */
           display: flex;
          }