flex布局一行展示两个或者四个
时间: 2023-06-30 07:24:13 浏览: 209
可以使用flex布局中的`flex-wrap`属性和`flex-basis`属性来实现一行展示两个或四个元素。
1. 一行展示两个元素
```css
.container {
display: flex;
flex-wrap: wrap;
}
.item {
flex-basis: 50%;
}
```
2. 一行展示四个元素
```css
.container {
display: flex;
flex-wrap: wrap;
}
.item {
flex-basis: 25%;
}
```
以上代码中,`.container`是父元素,`.item`是子元素。`flex-wrap`属性设置为`wrap`表示子元素超出容器宽度后换行,`flex-basis`属性设置为50%或25%表示每个元素占据父元素宽度的一半或四分之一。
阅读全文