display: flex;平均分布
时间: 2023-09-13 17:06:02 浏览: 68
要现平均分布,可以使用display: flex;结合align-items和justify-content属性。
对于align-items属性,可以设置为stretch,这样子元素会在交叉轴上平均分布,即垂直方向上平均分布。
而对于justify-content属性,可以设置为space-between,这样子元素会在主轴上平均分布,即水平方向上平均分布,且元素之间的间距相等。
因此,如果想要实现display: flex;平均分布,可以这样设置样式:
```css
.container {
display: flex;
align-items: stretch;
justify-content: space-between;
}
```
这样就可以实现子元素在容器内平均分布的效果。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [display:flex详解](https://blog.csdn.net/Anony_me/article/details/125524220)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]