共计 851 个字符，预计需要花费 3 分钟才能阅读完成。
实现左右居中：
办法一：
margin: 0 auto;办法二：
display: flex;
justify-content: center;办法三：（特定状况，比方标签内容居中，文字按钮内容居中）
padding: 0 20px;办法四：
position: relative;
transform: translateX(-50%);办法五：
position: relative;
top: 50%;
margin-left: -20px;办法六：
display: gird;
justify-items: center;办法七：
display: table-cell;
text-align: center;
实现高低居中：
办法一：
margin auto 0;办法二：
display: flex;
align-items: center;办法三：
display: gird;
align-items: center;办法四：
padding: 20px 0;办法五：
position: relative;
transform: translateY(50%);办法六：
position: relative;
top: 50%;
margin-top: -20px;办法七：
display: table-cell;
vertical-align: middle;办法八：
line-height: 40px;
实现上下左右居中：
办法一：
position: relative;
top: 0;
left: 0;
bootom: 0;
right: 0;办法二：
display: flex;
align-items: center;
justify-content: center;办法三：
display: gird;
align-items: center;
justify-items: center;办法四：
display: table-cell;
text-align: center;
vertical-align: middle;办法五：
padding: 20px 20px;办法六：
margin: 0 auto;
line-height: 40px;正文完