1.父元素设置 text-aligncenter, 子元素设置：display:inline-block; line-height:宽度
（例子仅做参考，精华以言明）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link href="https://cdn.bootcss.com/mui/3.4.0/css/mui.min.css" rel="stylesheet">
<title>居中</title>
<style>
.pagination {
margin-top: 20px;
font-size: 0;
text-align: center;
}
.pagination li {
line-height: 25px;
display: inline-block;
*display: inline;
font-size: 14px;
margin: 0 5px;
}
.pagination a {
display: block;
color:
text-shadow: 1px 0 0
padding: 0 10px;
border-radius: 2px;
box-shadow: 0 1px 0
background: linear-gradient(top,
}
.pagination a:hover {
text-decoration: none;
background:
box-shadow: 0 1px 0
background: linear-gradient(top,
}
</style>
</head>
<body>
<div class="pagination">
<ul>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>
</div>
</body>
</html>
2.对于要浮动的元素 或者 position：absolute 绝对定位的元素 可直接在父元素上设置样式 float:left;left:50%;transform：translateX（-50%）
.pagination {
overflow: hidden;
border:1px solid
}
.pagination ul{
float:left;
position: relative;
left:50%;
list-style:none;
transform:translateX(-50%)
}
.pagination li {
float: left;
line-height: 25px;
font-size: 14px;
position: relative;
margin: 0 5px;
}
3.对于要浮动的元素 或者 绝对定位的元素 可在父元素上设置样式 position：absolute left:50%;子元素设置：margin-left:-50%
.pagination {
position: absolute;
left:50%;
border:1px solid
}
.pagination ul{
position: relative;
list-style:none;
margin-left:-50%;
}
.pagination li {
float: left;
line-height: 25px;
font-size: 14px;
position: relative;
margin: 0 5px;
}
4.flex 布局 在父元素上定义 dispaly:flex
.pagination ul{
display:flex;
flex-direction: row;
justify-content: center;
align-items: center;
list-style:none;
}
5.fit-content 在父元素上定义 fit-content
.pagination ul{
margin:0 auto;
width:-webkit-fit-content;
width:fit-content;
list-style: none;
margin-top:30px;
}
6.实现元素的垂直居中 在父元素上定义display:table;子元素：dispaly:table-cell;vertical-align:middle
.pagination {
display:table;
}
.pagination .main {
display: table-cell;
vertical-align:middle;
font-size: 14px;
position: relative;
margin: 0 5px;
}
