我们做网站时，往往需要制作图片列表，但有时每个图片宽度设置一样后，高度会不一样，这就导致了网站版面排序混乱。如下图：
怎么解决这种排序混乱的问题呢？下面介绍一下解决方法。
由于是图片为响应式布局，不能用css固定图片的高度，从代码上看，这里每个图文用的是li，而且每4个li是一排，我们只需要对第1个li 第5个li 第9个li 。。。就是每排的第1个li加入css代码clear:left;即可
例如上面列子的代码，我们就可以在CSS中添加以下的样式代码：
.portfolio-list li:nth-child(4n+5) {
clear:left;
}
clear:left;
}
这样添加好css代码后，可解决错位问题。4n代表一行4个，如果一行5个就写成5n+6即可。
免责声明：网所有文字、图片、视频、音频等资料均来自互联网，不代表本站赞同其观点，内容仅提供用户参考，若因此产生任何纠纷，本站概不负责，如有侵权联系本站删除！邮箱:207985384@qq.com https://www.ainiseo.com/jianzhan/60835.html
