<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
#test{
background-color:#C2EDFF;
display:flex;
flex-direction:row-reverse;
justify-content:center;
user-select:none;
}
.box {
height:80px;
width:200px;
border-radius: 25px;
background-color:#F0F8FF;
text-align:center;
margin:10px;
align-items:center;
display:flex;
justify-content:center;
flex-wrap:wrap ;
align-content:center;
}
.box p{
font-size:20px;
}
</style>
<body>
<div id ="test">
<div class='box'><p>首 页</p></div>
<div class='box'><p>最 新</p></div>
<div class='box'><p>最 新</p></div>
<div class='box'><p>关 于</p></div>
</div>
</body>
</html>
来源：oschina
链接：https://my.oschina.net/u/4414119/blog/3234327