flex布局独占一行实现方法
目录
一、问题
二、实现方法
三、总结
如嫌繁琐，可直接移步 三、总结
一、问题
1.希望flex布局中某些项 独占一行。比如下面这段代码：希望第一个div独占一行
独占一行box1box2二、实现方法
1.设置 父亲盒子 flex-box ： flex-wrap:wrap;
同时 设置希望独占一行的 盒子 oneline: width:100%;
1）scss样式如下：
.flex-box{display: flex;flex-wrap: wrap;.oneline{width:100%;}}2) 具体实现效果： 如图2-1所示
2.不设置 flex-wrap:wrap；则无法实现独占一行，如图2-2所示
三、总结
1.自己写的时候忘记 设置 flex-wrap: wrap；所以一直有问题。
2.flex布局某一个item独占一行：父盒子flex-wrap:wrap;同时需独占一行的盒子：width:100%;
/*
希望对你有帮助！
如有错误,欢迎指正！非常感谢！
*/
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！