css 布局排版问题的解决
在 css 布局中，需要根据不同的元素内容和位置进行调整。当需要在固定宽度容器中动态展现多个元素时，可能会遇到排版问题。
问题描述
如下图所示，需要在固定宽度的容器中排列一定数量的元素。这些元素的展示与隐藏可能根据其他元素的状态而定。当元素数量为偶数时，需要将其排列为每行两列，每个元素宽度固定。而当元素数量为奇数时，最后一个元素需要独占一行。
解决方案
立即学习“前端免费学习笔记（深入）”；
要满足此需求，可以使用以下 css 选择器：
.list .item:last-child:not(:nth-child(2n)) {
/* 样式代码 */
}这个选择器可以选中容器中最后一个元素，并且其位置不是 2n（不是偶数位置）。这样，便可以针对奇数位置的最后一个元素设置样式，使其独占一行。
示例演示
例如，在容器中加入以下 html 代码：
item 1item 2item 3
并使用前文提供的 css 样式：
.list .item {
width: 100px;
height: 100px;
float: left;
}
.list .item:last-child:not(:nth-child(2n)) {
clear: both;
}效果如下图所示：
- 当元素数量为偶数时：
- 当元素数量为奇数时：
