如何用CSS中的flex实现ul两列分布
时间: 2023-02-25 08:11:33 浏览: 140
Flex中的CSS样式.pdf
你可以使用以下代码实现在CSS中使用flex布局的ul列表的两列分布:
```
ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
li {
width: calc(50% - 10px);
}
```
上面的代码将设置ul元素为flex布局,并设置flex-wrap属性为wrap,以便当容器内部元素的数量超出容器的宽度时,将自动换行。 justify-content属性设置为space-between,以便将元素平均分布在容器的两端。
对于每个li元素,它的宽度将设置为50%,再减去10像素的间距,以便在两列之间放置间距。
阅读全文