flex布局实现对齐效果中出现BUG的问题如何解决-群英

上一篇：如何用CSS写一个点击后出现加载特效的效果下一篇：用CSS怎样做一个类似win10鼠标移过照亮边框的效果

这篇文章主要讲解了“flex布局实现对齐效果中出现BUG的问题如何解决”，文中的讲解内容简单、清晰、详细，对大家学习或是工作可能会有一定的帮助，希望大家阅读完这篇文章能有所收获。下面就请大家跟着小编的思路一起来学习一下吧。

在设置display:flex,justify-content: space-betweend的时候，它会把子元素靠边对齐平均分剩余的空间。

例如：打算一行放三个子元素

效果：

这看起来一点问题都没有，还挺好看的，但是如果下一行不够三个呢，只有两个的时候就会出现问题。

这样看起来特别恶心，中间空了一大块出来，看起来特别像一个bug，而不是我们要的跟上一行一个一个对齐的效果。

现在来解决这个问题，在这里提供两个方法：

伪类方案

占位元素方案

效果

上述内容具有一定的借鉴价值，感兴趣的朋友可以参考，希望能对大家有帮助，想要了解更多"flex布局实现对齐效果中出现BUG的问题如何解决"的内容，大家可以关注群英网络的其它相关文章。

标签： flex布局

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。

上一篇：如何用CSS写一个点击后出现加载特效的效果下一篇：用CSS怎样做一个类似win10鼠标移过照亮边框的效果