#yyds干货盘点#弹性布局中让其中一个元素靠右显示
精选
原创
©著作权归作者所有:来自51CTO博客作者歆冉的原创作品,如需转载,请与作者联系,否则将追究法律责任
1.效果
2.代码
<body>
<div class="container">
<div class="item">1</div>
<div class="item">2</div>
<div class="item">3</div>
<div class="item">4</div>
<div class="item">5</div>
<div class="more">......</div>
</body>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
.container {
width: 50%;
height: 200px;
padding: 30px;
background-color: aquamarine;
margin: 100px auto;
display: flex;
align-items: center;
}
.container .item{
height: 100%;
padding: 10px;
margin: 10px;
background-color: #1acd7e;
}
.container .more {
height: 100%;
width: 100px;
background-color: #ccc;
margin-left: auto;
}
3.核心代码说明
4.总结