Bootstrap：img-responsive vs img-fluid

Question

我正在使用bootstrap 3.3.6，我正在使用类img-responsive来响应图像。

我找到了一个新的类名img-fluid，但它在3.3.6版本中没有出现。

任何人都能说出img-responsive和img-fluid之间的区别是什么？

img-responsive只是根据父容器大小调整图像大小，我们可以使用css属性width：100％和height：auto来实现它。那为什么要使用想象敏感的课程？

Answer 1

img-responsive在Bootstrap 3中，img-fluid自测试版以来就在Bootstrap 4中。

  

删除display：block;来自.img-fluid。响应式图像行为不依赖于display：block;，因此我们可以安全地删除它。如果您需要块级别​​，您可以轻松地在源代码或实用程序类中覆盖它。

.img-fluid {
  max-width: 100%;
  height: auto;
}
.img-responsive {
  display: block;
  max-width: 100%;
  height: auto;
}