CSS盒子居中

子盒子加内容自居中

方法1：弹性布局

display: flex;
align-items: center; // 纵轴对齐方式，默认是纵轴 子元素垂直居中
justify-content: center; //纵轴对齐方式，默认是纵轴

方法2、使用高度平行

height：80rpx，
line-height: 80rpx;

父子盒子内容居中

方法一：弹性布局

<style>
.box {  //父盒子
  width: 200px;
  height: 200px;
  border: 1px solid red;
  display: flex;
}
.child {  //子盒子
  background: red;
  margin: auto; // 水平垂直居中
}  
</style>
 
<div class="box">
  <div class="child">水平垂直居中</div>
</div>

方法二：弹性布局

<view class="myinfo_popupbox_popu_box_butbox">
	<view class="myinfo_popupbox_popu_box_butbox_but">复制密码</view>
	<view class="myinfo_popupbox_popu_box_butbox_but2">一键连接</view>
</view>



&_butbox {
			width: 100%;
			height: 20%;
			display: flex;
			justify-content: space-around;
			align-items: center;
			text-align: center;

	&_but {
			border: 1px solid #57AB6D;
			width: 40%;
			height: 100%;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 35rpx;
		}

		&_but2 {
				border: 1px solid #57AB6D;
				width: 40%;
				height: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
				border-radius: 35rpx;
			}
		}