css3如何利用flex布局每行显示固定个数,下面编程教程网小编给大家介绍一下实现代码!
实现代码如下:
ul{
width: 100%;
display: flex;
justify-content: center;
align-items: center;
flex-flow: row wrap;
li{
display: flex;
justify-content: center;
align-items: center;
flex: 0 0 20%;
height: 70px;
font-size: 18px;
border-right: 1px solid #ddd;
box-sizing: border-box;
border-bottom: 1px solid #ddd;
}
}
以上是编程学习网小编为您介绍的“flex布局每行显示固定个数”的全面内容,想了解更多关于 前端知识 内容,请继续关注编程基础学习网。
编程基础网
本文标题为:flex布局每行显示固定个数
基础教程推荐
猜你喜欢
- IE6,IE7和firefox对DIV的支持区别 2023-12-08
- 深入理解React Native核心原理(React Native的桥接(Bridge) 2023-12-26
- 如何在vue项目里面展示 pdf文件 2023-10-08
- 在ASP.NET 2.0中操作数据之三:创建母版页和站点导航 2024-03-10
- div footer标签css实现位于页面底部固定 2023-12-21
- 详解vue2.0+vue-video-player实现hls播放全过程 2023-12-14
- Windows上的HTML5地理定位比Linux更准确(Firefox,Chrome,[Chromium]) 2023-10-25
- javascript原型链图解的总结和实践 2023-08-12
- cocos creator游戏实现loading加载页面,游戏启动加载动画 2022-10-30
- JavaScript本地数据存储sessionStorage与localStorage使用详解 2024-01-12
