WebApp 元素上下居中

最新推荐文章于 2021-06-20 18:13:21 发布

chuierdao2535

最新推荐文章于 2021-06-20 18:13:21 发布

阅读量100

点赞数

原文链接：https://my.oschina.net/ProgramDu/blog/516551

版权

HTML页面代码

<div class="content">
			<div class="itme_div itme_div2">programmerdu</div>
		</div>

CSS代码

.content {
  width: 100%;
  background: #089DB0;
  height: 400px;
  color: #FFFFFF;
  position: relative;
}
/*方二*/
.content.itme_div1 {
  -webkit-align-items: center;
  -webkit-justify-content: center;
  display: -webkit-flex;
}
.content .itme_div {
  width: 50%;
  height: 50%;
  background: red;
  z-index: 3;
}
/*方法一*/
.content .itme_div1 {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
}

转载于:https://my.oschina.net/ProgramDu/blog/516551