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布局每行显示固定个数
基础教程推荐
猜你喜欢
- 谈谈你对aja的理解(一、二) 2022-10-17
- 智能应用横幅;适用于Android / Google Play的Windows应用商店HTML元标记? 2023-10-25
- shell之发送html格式邮件 2023-10-29
- Javascript运行机制之Event Loop 2023-08-08
- css高度塌陷问题的解决方案 2023-12-23
- js相册效果代码(点击创建即可) 2023-12-02
- 通过Ajax方式上传文件使用FormData进行Ajax请求 2023-01-20
- 往xml中更新节点的实例代码 2023-01-20
- js中的window.open返回object的错误的解决方法 2024-01-09
- JavaScript跨域方法汇总 2024-02-09