Tumblr - 使图片帖子具有响应性答案

【问题标题】：Tumblr - Make image posts responsiveTumblr - 使图片帖子具有响应性
【发布时间】：2019-01-13 05:59:07
【问题描述】：

我能够弄清楚要做什么才能使视频嵌入具有响应性（在 css 样式表中添加少量内容，并在 html 编码中添加一些内容 - 很好）。

我无法通过图片弄清楚这一点。我以前在 html 中做 Tumblr 帖子更改，图片的嵌入是这样的：

</p><figure class="tmblr-full" data-orig-height="332" data-orig-width="1170"><img src="https://66.media.tumblr.com/fbfec10da6006e67fce4be8f5d7343ff/tumblr_inline_pl7kmovAHp1svrcsh_540.png" data-orig-height="332" data-orig-width="1170" alt="image"></figure><p>

有人可以帮助指导我吗？我对照片集或类似的东西不感兴趣。图像一旦移动就会调整大小。

【问题讨论】：

标签： html css responsive-design tumblr

【解决方案1】：

您可以像这样为您的imgs 使用max-width 选项：

<img src="https://66.media.tumblr.com/fbfec10da6006e67fce4be8f5d7343ff/tumblr_inline_pl7kmovAHp1svrcsh_540.png"
  data-orig-height="332"
  data-orig-width="1170"
  alt="image"
  style="max-width: 100%">

或 CSS：

/* On screens that are 1169px or less, set the max-width of img to 100% */
@media screen and (max-width: 1169px) {
  img {
    max-width: 100%;
  }
}

【讨论】：