<!-- 1.通过css布局利器将flex将子框转换为flex item,在设置子框居中以达到居中 -->
<!-- 缺点是兼容性,低版本浏览器不兼容 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>水平居中:使用flex+margin</title>
<!-- 1.通过css布局利器将flex将子框转换为flex item,在设置子框居中以达到居中 -->
<!-- 缺点是兼容性,低版本浏览器不兼容 -->
<style type="text/css">
.parent{
display: flex;
}
.son{
margin: 0 auto;
background-color: red;
}
</style>
</head>
<body>
<div class="parent">
<div class="son">
使用flex+margin
</div>
</div>
</body>
</html>