【问题标题】:Making responsive images at center by using bootstrap使用引导程序在中心制作响应式图像
【发布时间】:2018-06-23 17:50:20
【问题描述】:
 <img class="img-responsive center-block"/>

   <div class="col-sm-2 mb-xs-30 wow fadeInUp">
    <div class="team-item">
         <div class="team-item-image">
               <img src="images/team/jy.png" alt="" />

我正在尝试使所有图像都位于中心。但是,我不知道应该使用哪个引导代码。 我尝试在该部分的顶部使用 img-responsive,但失败了。 给定的代码是图像的一部分,这是我给出的第一个框。

【问题讨论】:

  • 您使用的是 bootstrap v3 还是 v4?而且我认为使用 img-responsive 时 center-block 不会起作用。
  • 没有引导你可以让img响应img:max-width:100%试试吧

标签: html css


【解决方案1】:

据我了解,您正在尝试制作一个居中的行、五个等距且居中的图像列,并且您正在使用引导程序,这是指向 the solution 的链接。

【讨论】:

  • 我查了一下,好像右边的空白比左边的大很多。
  • 我明白你在说什么,尝试一些东西。编辑:Codepen 上有一个解决方案,codepen.io/DenisDov/pen/pyjpgP
  • codepen.io/devdanpark/pen/mpjxyG 不知道你能不能看到这个。这是我的代码,但看起来左边的空间仍然更大()现在没有图像)
  • 我不明白你的意思。
  • 我已经删除了我的旧 cmets,因为它们无助于以最佳方式解决您的解决方案,见上文。该链接将解决您需要解决的问题,但您可能需要编辑媒体查询以使其在较小的尺寸下真正响应。
猜你喜欢
  • 1970-01-01
  • 2014-03-09
  • 1970-01-01
  • 2015-09-26
  • 2021-04-05
  • 1970-01-01
  • 2016-08-15
  • 2014-07-14
  • 2013-09-21
相关资源
最近更新 更多