flexbox下

最新推荐文章于 2025-06-15 09:08:55 发布

转载最新推荐文章于 2025-06-15 09:08:55 发布 · 39 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/ningjie/p/9614796.html

@charset"utf-8";
p{
    width:150px;
    border:1px solid gray;
    background-color:silver;
    padding:5px;
    margin:5px;
}
div{
    display:flex;
    flex-direction:column;/*从上网下*/
    flex-direction:row-reverse;/*从右网左*/
    flex-wrap:wrap;/*自动换行 (nowrap)*/
    flex-flow:row wrap;/*简写*/
    fjustify-contenn:center;/*居中*/
    fjustify-content:fiex-end;/*靠右*/
    fjustify-content:spance-between;/*平局分布*/
    fjustify-content:spance-around;/*也是平局分布的一半*/
    align-items:center; /*去除上下 垂直居中*/


}
p:nth-child(1){ flex:1; order:3; }
p:nth-child(2){ flex:3; order:2; }
p:nth-child(3){ flex:1; order:1; }