互联网知识

精准传达 • 价值共享

洞悉互联网前沿资讯,探寻网站营销规律

查看其它板块

css3响应式图片列表高度不同导致页面错位解决方法

作者:狐灵科技 | 2019-09-02 11:22 |点击:

响应式图片列表高度不同导致页面错位

前端html代码分析

 

由于是响应式布局,不能用css固定图片的宽高,从代码上看,这里每个图文用的是li,而且每4个li是一排,我们只需要对第1个li 第5个li 第9个li 。。。就是每排的第1个li加入css代码clear:left;即可

例如上面列子的

.portfolio-list li:nth-child(4n+5) { clear:left; }

这样添加好css代码后,可解决错位问题

如没特殊注明,文章均为狐灵科技原创,转载请注明   "css3响应式图片列表高度不同导致页面错位解决方法
多一份免费策划方案,总有益处。

请直接添加技术总监微信联系咨询

网站设计 品牌营销

多一份参考,总有益处

联系狐灵科技,免费获得专属《策划方案》及报价

咨询相关问题或预约面谈,可以通过以下方式与我们联系

业务热线:15082661954 / 大客户专线:15523356218