html横菜单中菜单均匀分布,html – 如何在flexbox中的行间均匀分布元素？

Assuming flex-direction: row and that three

该陈述中隐含的是每个div等于或小于完整行的宽度的1/3.

因此通常你的结果会说….

#flex {

display: flex;

flex-wrap: wrap;

background: orange;

}

#flex div {

border: 1px solid white;

height: 100px;

width: 33%;

background: rebeccapurple;

}

但是,从请求中你似乎希望在第二个元素之后打破行/行.

正如@Oriol here所解释的那样,这只能通过改变结构或使用聪明的方法插入不可见的实际或伪元素来强制换行来完成.

例如：

#flex {

display: flex;

flex-wrap: wrap;

background: orange;

justify-content: space-around;

}

#flex div {

border: 1px solid white;

height: 100px;

width: 33%;

background: rebeccapurple;

}

#flex::before {

content: "";

width: 100%;

order: 1;

}

div:nth-child(n + 3) {

order: 2;

}

html横菜单中菜单均匀分布,html – 如何在flexbox中的行间均匀分布元素？相关推荐

如何在Flexbox中垂直对齐文本？
本文翻译自:How to vertically align text inside a flexbox? I would like to use flexbox to vertically align ...
符号在excel中的引用_如何在Excel中添加项目符号
&符号在excel中的引用 There's no built-in feature for bullets in Excel, like there is in a Word document ...
outlook从服务器中恢复已删除项目,如何在Outlook中恢复已删除的任务
如果我们知道有哪些装机必备的系统工具,那么在Microsoft Outlook中恢复已删除文件的任务就不会显得如此棘手,令人伤神.有几种高效的已删除邮件恢复方式,用户可以使用它们完成Outlook文件 ...
如何在word中制作流程图_如何在Word中创建流程图
如何在word中制作流程图 Microsoft Word provides built-in tools for creating and arranging different types of f ...
html中section与div,如何在html中的section标签内包含div标签
我正在制作一个完整版块的页面网站,如this.每个页面都有自己的标签.目前我的网页有4个部分(呈现不同的背景颜色).如何在html中的section标签内包含div标签我的第一部分有一个容器div, ...
如何在geth中创建genesis.json_如何在Photoshop中应用“通道混合器”创建一个复古韵味色调...
现在从Photoshop屏幕右侧的"调整"面板中选择"通道混合器" 在设置中,您应从"输出通道"下拉列表中选择"红色", ...
python中range 10 0_如何在python中使用range方法
如何在python中使用range方法发布时间:2021-01-05 16:55:23 来源:亿速云阅读:94 作者:Leah 如何在python中使用range方法?很多新手对此不是很清楚,为了 ...
css中 media的用法,如何在css中正确使用@media
如何在css中使用@media作为特定分辨率?所以我想让我的侧栏更改取决于用户分辨率,所以我使用@media.如何在css中正确使用@media 这是示例代码: @media (max-width: ...
javascript字典中添加数组_如何在JavaScript中使用数组方法：Mutator方法
JavaScript中的数组由元素列表组成.JavaScript有许多有用的内置方法来处理数组.修改原始数组的方法称为mutator方法,返回新值或表示的方法称为accessor方法.在本教程中,我们 ...
java 中覆写tostring_如何在Java中正确覆盖toString（）？
如何在Java中正确覆盖toString()? 听起来有点愚蠢,但我需要帮助我的toString()方法,这是非常irking. 我尝试在网上查找,因为toString是搞砸了,"没有找到K ...

html横菜单中菜单均匀分布,html – 如何在flexbox中的行间均匀分布元素？

html横菜单中菜单均匀分布,html – 如何在flexbox中的行间均匀分布元素？相关推荐

最新文章

热门文章