始终居中的响应图像

时间:2017-02-13 14:37:09

标签: image twitter-bootstrap-3 responsive

我想要实现以下目标。让我们假设6个公司徽标垂直放置在桌面视图上。当我在平板电脑上观看网站(或手动缩小浏览器)时,2个公司徽标会跳转到下一行,但我希望它们居中。并没有像所有网格系统那样向左浮动。有可能吗?特别是Bootstrap?

我的理论是,如果我能知道第二行中的哪些图像,我可以计算左边的偏移量,然后用js将图像移动到居中位置。但只是,如果需要,所以如果3个图像跳到新行,那没关系,与它们无关。我是对的吗?

没有找到任何知道此特定功能的解决方案或插件。

1 个答案:

答案 0 :(得分:0)

可以使用Javascript来执行此操作,但在大多数情况下使用响应断点执行此操作会更好。因此,如果您的桌面网格类为col-md-2,并且当转换为平板电脑尺寸时,两次跳转,通常最好只制作徽标col-sm-4,每行制作3个徽标。

如果您发现只有2张图片在平板电脑上跳了下来,您还可以将col-sm-6添加到最后两张图片中,以便将这些图片放在下一行中。