在特定断点处停止图像响应 Ruby on Rails答案

【问题标题】：Stopping image responsiveness at a particular breakpoint Ruby on Rails在特定断点处停止图像响应 Ruby on Rails
【发布时间】：2016-11-19 09:54:33
【问题描述】：

在我的 rails 应用程序中，我使用样式标签缩放了背景图像以响应，如下面的代码所示，它可以正常工作。

<div><%= image_tag('slider4.jpg', style:'height:auto; width:100%;')%></div>

但我希望它的响应在特定断点处停止，假设宽度约为 786 像素。

【问题讨论】：

你看过css样式max-width吗？
是的，但由于某种原因，max-width 在我尝试时不起作用。这是我在这种情况下使用的min-width: 100%; max-width: none;
你为什么要使用max-width:none？如果您希望图像的最大宽度为 768px，那么您可以使用它作为您的值：max-width:768px
好的，但是当我使用 <div><%= image_tag('slider4.jpg', style:'height:auto; max-width:786px;')%> 时，它仍然缩放到 786 像素并高于该断点，没有响应。我想要的只是阻止它在 786px 以下响应。 786px 以上应该是响应式的。
与width、width:100%; max-width:768px; 一起使用，告诉它使用父级宽度的 100% 但不超过 768px，如果它不起作用，您可能有其他样式作用于它。

标签： javascript ruby ruby-on-rails-4 twitter-bootstrap-3

【解决方案1】：

从 cmets 的基础上，就在问题上，从中推断出答案。

使用下面的代码，将父级的宽度设置为 100%，并指定最小宽度不超过 768 像素。

<div><%= image_tag('slider4.jpg', style:'height:auto; width:100%; min-width: 768px;') %>

这肯定行得通。

【讨论】：