bootstrap 列被图像放大

Question

我有一个 row 包含一些 col-md。在最后一列中，我有一张图片，当在移动设备上呈现网站时 phone，最后一列被图片放大并移到新行中。

玉:

div.row#contact
   div.col-md-3
   div.col-md-2
   div.col-md-1
   div.col-md-1
   div.col-md-1
   div.col-md-1      
   div.col-md-3
     img(src = "./images/wko_logo.svg", alt = "wko logo")

scss:

img {
        max-width: 100%;
        height: auto;
    }

Answer 1

Bootstrap 的网格系统使用 sm 列，直到容器宽度降至 768px 以下，如 https://getbootstrap.com/css/#grid-options 中所定义。当它低于该宽度时，它会给每个 .col-sm-* div 100% 宽度。给你的 html 元素一个 xs 容器宽度的行为，你的问题就解决了。

可以在 https://jsfiddle.net/fqxg3L9p/ 找到一个工作示例。