css 元素垂直居中方法

Sam young

于 2022-11-02 15:22:30 发布

阅读量69

点赞数

分类专栏：知识点文章标签：前端 html

本文链接：https://blog.csdn.net/young_sam/article/details/127652312

版权

知识点专栏收录该内容

28 篇文章 0 订阅

订阅专栏

1. flex布局方法

<div class="father">
	<div class="child"> </div>
</div>

<style>
 .father {
  display: flex;
  justify-content: center;
  align-items: center;
 }
</style>

2. position 方法

<div class="father">
	<div class="child"> </div>
</div>

<style>
 .father {
	position: relative;
 }

 .child {
    left: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
  }
</style>